21 окт.
2010

О текстареи

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

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

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

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

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

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

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

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

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

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

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

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

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

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

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

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

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

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

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

Eugene, 2 июня, 23:25

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

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

Анонимный комментарий будет опубликован от имени Ояма Ивао

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

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