• 1340
  • 0
  • Автор: htmldrive
  • Адаптировал: irbees2008
  • Источник:
  • Уровень сложности исполнения: это делается простым копированием и нажиманием кнопки
  • Демо:

Динамическое меню с скольжением цвета , подходит для личного развлекательного блога или сайта.

1.Скачиваем архив Вы не можете скачивать файлы с нашего сайта ,рекомендуем Вам зарегистрироваться либо войти на сайт под своим именем. , и заливаем в папку с шаблоном.
2.Подключаем стили и скрипты в хеад main.tpl

Код:
<link href="{tpl_url}/css/webwidget_menu_glide.css" rel="stylesheet" type="text/css"></link>
<script type="text/javascript" src="{tpl_url}/js/webwidget_menu_glide.js"></script>
У кого не подключен jquery, подключите.
3.Само меню ,вставляем туда где оно должно быть у вас
Код:
<div id="webwidget_menu_glide" class="webwidget_menu_glide">
<div class="webwidget_menu_glide_sprite"></div>
<ul>
<li><a href="https://ngcmshak.ru/">Home</a></li>
<li><a href="https://ngcmshak.ru/">News</a></li>
<li class="current"><a href="https://ngcmshak.ru/">About</a></li>
<li><a href="https://ngcmshak.ru/">Contact</a></li>
<li><a href="https://ngcmshak.ru/">More...</a></li>
</ul>
<div style="clear: both"></div>
</div>
Активный пункт меню присваивается класс
Код:
class="current"
4.Ну и последнее инициализация нашего меню
Код:
<script language="javascript" type="text/javascript">
$(function({$("#webwidget_menu_glide").webwidget_menu_glide({
menu_width:"100",
menu_height:"30",
menu_text_size:"15",
menu_text_color:"#CCC",
menu_sprite_color:"#666",
menu_background_color:"#000",
menu_margin:"5",
sprite_speed:"normal"
});
});
</script>
Вот и все пользуемся ,вот еще и таблица с параметрами


menu_width:

Ширина меню

menu_height:

Высота Меню

menu_text_size:

Меню размер текста

menu_text_color:

Цвет текста меню

menu_sprite_color:

Анимация спрайта цвет

menu_background_color:

Меню Цвет фона

menu_margin:

Рентабельность Меню

sprite_speed:

Скорость анимации (вариант: медленно, нормально, быстро, без ожидания)

Можешь почитать и вот эту статейку "Полно экранное слайдшоу"

mistakes

Это тоже интересно

Уважаемый посетитель, Вы зашли на сайт как незарегистрированный пользователь.
Мы рекомендуем Вам зарегистрироваться либо войти на сайт под своим именем.

Ваше мнение

На каком движке ваш сайт?
Результаты

----