Блог ленивого вебмастера

Вывод контекстной подсказки с помощью AJAX

На страницах вашего сайта содержится множество специализированных терминов. Когда пользователь просматривает сайт, у него могут возникать вопросы касательно этих терминов. Как сделать так, чтобы посетитель сайта по мере возникновения вопросов мог незамедлительно получать на них ответы? Раньше термины на страницах сайта оформлялись как ссылки и пользователь при желании мог кликать по ним и получать окно с контекстной подсказкой. Это подход достаточно неуклюжий, он отнимает у пользователя слишком много времени - на то, чтобы кликнуть по ссылке, дождаться загрузки окна и затем закрыть окно. В эпоху AJAX мы можем быть ближе к пожеланиям пользователей. Мы можем сделать так, чтобы уже при наведении мыши на термин незамедлительно появлялось сообщение с подсказкой и как только курсор мыши сдвинут с термина, сообщение исчезало. Наличие этого сервиса не отразится на объеме страниц сайта. При запросе контекстной подсказки Java Script будет обращаться к внешнему словарю, получать содержание и отображать его.

Подробнее...


Ещё о тултипе (подсказке), движущейся вместе с курсором.

Недавно я разрабатывал сайт primaphoto.ru

В процессе возникла необходимость показывать томбнейлы (превьюшки) изображений продукции при наведении на соответствующие строки прайс-листа.

Решил задачу путем небольшой модификации скрипта из предыдущей статьи:

Подробнее...


Зачем нужна DOM-модель

Так как getElementByld является методом объектной модели документа W3C DOM, совместимые браузеры пропустят его из-за применения условного оператора if, не поддерживающие модель DOM браузеры не поймут getElementByld и перейдут к странице, содержимое которой им доступно.

Переадресация JavaScript обнуляет список функции Назад в браузере, и это нехорошо. Но вам необязательно использовать в этой ситуации window, location. Вы можете применить любой удобный вам и вашим пользователям способ.

Подробнее...


Тултип, движущийся вместе с курсором

Тултип создается очень несложно, код сосотоит из

(наведите курсор на ссылки сверху, чтобы посмотреть примеры тултипов)

Подробнее...