Адаптация красивого, плавающего меню для DLE
Адаптировал: Golden
DLE: 9.3 (и ранние версии)
Демо: g-dev.ru
Адаптировал:
DLE: 9.3 (и ранние версии)
Демо:
Скачиваем скрипты
Прикреплённые файлы:
Файл: gdev.zip
Размер: [1,06 Kb] (забрали: 96 раз)
Подключаем
Скрипты кидаем в папку js вашего шаблона
Открываем файл шаблона main.tpl
между тегами
<head></head>
Вставляем:
<script type=»text/javascript» src=»{THEME}/js/g.dev.js»></script>
<script type=»text/javascript» src=»{THEME}/js/jquery.hoverflow.min.js»></script>
<script type=»text/javascript» src=»{THEME}/js/jquery.hoverflow.min.js»></script>
Что бы заставить ваше меню двигаться обозначим его тегом
<menu>
Пример:
<menu>
<li><a href=»#»>О сайте</a></li>
<li><a href=»#»>В мире</a></li>
<li><a href=»#»>Экономика</a></li>
<li><a href=»#»>Религия</a></li>
<li><a href=»#»>Криминал</a></li>
<li><a href=»#»>Спорт</a></li>
<li><a href=»#»>Культура</a></li>
<li><a href=»#»>Инопресса</a></li>
</menu>
<li><a href=»#»>О сайте</a></li>
<li><a href=»#»>В мире</a></li>
<li><a href=»#»>Экономика</a></li>
<li><a href=»#»>Религия</a></li>
<li><a href=»#»>Криминал</a></li>
<li><a href=»#»>Спорт</a></li>
<li><a href=»#»>Культура</a></li>
<li><a href=»#»>Инопресса</a></li>
</menu>
Стили
menu {
display: block;
margin-bottom: 1em;
margin-left: 5px;
margin-top: 1em;
padding-left: 2px;
padding-right: 2px;
}
display: block;
margin-bottom: 1em;
margin-left: 5px;
margin-top: 1em;
padding-left: 2px;
padding-right: 2px;
}
Библиотека jQuery подключена в DLE по умолчанию, обязательна для работы скрипта, если же по каким либо причинам она отсутствует подключаем.