Смайлики в поле Input

[systemiv]

Часто встречаю, что в поле текстовом поле, справа есть маленький смайлик, при нажатии которого открывается меню со смайлами.
Может видели?
Как это вообще возможно?
И как это сделать?

[PixoiD]

css html и немножко магии(javascript))))

[systemiv]

Ну я догадался что не Assambler=))
Просто как это сделать?

[Roms]

Ну я догадался что не Assambler=))
Просто как это сделать?

Вам нужно готовое решение с документацией? То это в гугл, увы под рукой такого не имею.

Если хотите сами сделать, то посмотрите js сорсы сайтов, на которых вы это видели.

А вообще сверх сложного в данной задаче нету.
Создаёте невидимый див блок с нужными смайлами, при нажатии на маленький смайл (сработает событие) блок становится видимым и поверх страницы в определённом месте, чтобы блок пропал опять нужно событие.
Клик по смайлу из блока вызывает событие, которое вставляет определённый текст (код смайла) в текстовое поле.

[systemiv]

Это я всё понимаю. Это не проблема. Для закрытия и открытия использую класс "selected", добавляя и удаляя его при клике. Тема в другом. как поместить этот ДИВ в поле инпут?

Из меня плохой хужожник, и ещё этот ГИМП, я в нём толком не умею.
Но впринципе вот

Untitled.jpg (2.58 КБ) 3935 просмотров

[PixoiD]

<div style="position: relative;">
<input type="text"/>
<div style="position: absolute; right:5px;top:1px">смайл</div>
</div>

приблизительно так))) точно не измерял но как-то так))

[valkiriy]

а наверно можно еще и фоном сделать)

[TM123]

Забыли сказать что надо с границами поиграть, у input надо отключить вывод границ, а у внешнего div включить, будет выглядеть как смайлик в поле ввода