javascript - 单击时如何扩展文本区域

Question

我正在做一个有文本区域的小元素，我需要帮助使文本区域在鼠标单击时扩展，就像 twitter 和 facebook 那样。 textarea 起初应该看起来像一个文本字段，然后在单击时应该展开。

Answer 1

这可以在不使用 JavaScript/jQuery 的情况下使用 CSS 来完成 transitions .

textarea {
    height: 1em;
    width: 50%;
    padding: 3px;
    transition: all 0.5s ease;
}

textarea:focus {
    height: 4em;
}

<textarea rows="1" cols="10"></textarea>