![]() |
---|
деревообрабатывающие станки б у москва . | кровельные материалы москва и область . | кромкооблицовочные станки объявление москва . |
Универсальный навигационный блок
В этом уроке мы с Вами будем учиться делать небольшой навигационный блок с интересным эффектом при наведении курсора мыши на элемент меню. Этот блок может пригодится на Вашем сайте. Вот как он выглядит: Итак, по шагам. Шаг 1. Создайте основу навигации в таком формате: <div style="padding:20px; border:1px solid #cccccc; width:150px;"> Если у Вас будет больше пунктов в меню, то продолжайте их создавать только атрибуту id присваивайте следующие по порядку номера id='rollshift9', id='rollshift10' и т.д. Поместите этот код в то место страницы, где Вы хотели бы видеть свой навигационный блок. Шаг 2. Перед этим кодом вставьте следующий скрипт: <script language="JavaScript"> Здесь Вы можете регулировать следующие параметры: rs_distance - на сколько пикселей будет смещение текста при наведении курсора мыши. rs_animation_delay - время задержки смещения в мс. rs_direction - направление смещения (вправо, влево, вниз, вверх). Шаг 3. После навигационного блока или перед закрывающимся тэгом </body> поместите скрипт из этого файла: Скачать фаил со скриптом для 3-го шага На этом процесс закончен, проверяйте результат во всех браузерах, всё должно работать как надо.
Если хотите не упустить данный урок, добавьте его в закладки:
Рейтинг: ![]()
Оставить комментарий: |
|
---|
|