21 окт.
2010

О текстареи

Текстареа — это многострочный элемент интерфейса, предназначенный для ввода текста пользователем. Если количество вводимых символов ограничено, то размер текстареи должен определяться этим значением.

Текстареа твитера.

А если максимальное количество вводимых символов не регламентировано, пользователь может набрать хоть «Войну и мир» и это следует учитывать.

Самое простое — сделать текстарею широкой и высокой, насколько это позволяет вёрстка сайта и высота окна браузера.

Говорят, в романе «Война и мир» 3 102 505 символов, включая пробелы.

Микроскопическая текстареа на сайте Капитал-груп. В настоящее время сайт переделан.

Ещё одна малютка на новом сайте Км/ч — картинка с капчей и то крупнее. В настоящее время форма переделана.

Итак, делаем максимально большую текстарею. Но тут есть один подвох. Текстареа имеет свою полосу прокрутки, а значит, если навести на нее случайно курсор мышки во время прокрутки страницы, то страница скролиться перестанет, а начнёт текстареа. Ещё хуже, если на странице несколько текстарей и каждая норовит «украсть» фокус мышки. Чтобы этого избежать, пользователю приходится постоянно думать о том, где сейчас находится курсор.

Решается проблема просто — надо растягивать текстарею в зависимости от введённого в неё текста.

Пример растягивающейся текстареи.

Подобные текстареи реализованы в Фейсбуке и Вконтакте. Попробовать на практике, как они работают можно в комментариях ↓ ниже.

4 комментария

Саша Реушкин, 15 ноя., 08:40

Такую реализацию текстареи впервые увидел в проекте mmm-tasty.ru

Алексей, 27 мар., 12:53

у меня как-то странно работает, увеличивает размер не сразу, т.е. можно сделать так что появится скролл, например этот текст вставленный в форму со скроллом

Антон Ловчиков, 27 мар., 12:56

Алексей, технология не доделана, согласен.

Кто хочет доделать? :)

Eugene, 2 июня, 23:25

А можно исходнички линком?

Ваш комментарий

Анонимный комментарий будет опубликован от имени Насреддин-шаха Каджара

Укажите ее, если хотите, чтобы никто не смог написать от вашего имени.

Комментарии не по существу, содержащие мат или оскорбляющие кого-либо будут удаляться.