Хаки и Скрипты Next Generation CMS

Красивое фиксированное слайд меню - Codrops

irbees2008 irbees2008 Опубликовано - 24 - января Меню и навигация
3179 - 0
  • Адаптировал: irbees2008
  • Источник:
  • Уровень сложности исполнения: нужны навыки css hmlt
  • Демо:

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

Код:
<link rel="stylesheet" href="css/style.css" type="text/css" charset="utf-8"/>
<script type="text/javascript" src="jquery-1.3.2.js"></script>
<script type="text/javascript">
$(function() {
var d=300;
$('#navigation a').each(function(){
$(this).stop().animate({
'marginTop':'-80px'
},d+=150);
});

$('#navigation > li').hover(
function () {
$('a',$(this)).stop().animate({
'marginTop':'-2px'
},200);
},
function () {
$('a',$(this)).stop().animate({
'marginTop':'-80px'
},200);
}
);
});
</script>
У кого подключен jquery повторно подключать не надо.

3.Вот и само меню
Код:
<ul id="navigation">
<li class="home"><a href=""><span>Home</span></a></li>
<li class="about"><a href=""><span>About</span></a></li>
<li class="search"><a href=""><span>Search</span></a></li>
<li class="photos"><a href=""><span>Photos</span></a></li>
<li class="rssfeed"><a href=""><span>Rss Feed</span></a></li>
<li class="podcasts"><a href=""><span>Podcasts</span></a></li>
<li class="contact"><a href=""><span>Contact</span></a></li>
</ul>
Все просто и красиво .Если что не понятно,пишем комментарии.

Можешь почитать и вот эту статейку "Тег input"

Опрос

Ваше мнение

Как вам наш дизайн сайта?
Результаты

Последние комментарии

Теги

Anything in here will be replaced on browsers that support the canvas element

Статистика

  • Caйту: 3950 дней
  • Новостей: 564
  • Комменты: 254
  • Зарегистрированно : 633
  • Онлайн всего: [5]
  • Гости: [5]
  • Были сегодня : [3] Яндекс, dankeanke, Google
  • SQL запросов: 32
  • Генерация страницы: 0.411сек
  • Потребление памяти: 5.166 Mb 
  •   Яндекс.Метрика