5 602 Скрипты / Menu & Nav

Горизонтальное меню с выпадающими подпунктами


Горизонтальное меню с выпадающими подпунктами. Выпадающие элементы используют jQuery, все остальное оформлено на CSS. В демо включен практически макет сайта, осталось только заполнить центральную часть контентом и нарисовать красивую шапку. Но можно использовать и только саму идею меню.

HTML

Структура самого меню довольно навороченная из-за его внешнего вида. Но в основе лежит обычный неупорядоченный список.

CSS

JS

И простейший скрипт, в отличие от навороченного css.

        <script type="text/jаvascript" src="http://ajax.googleapis.com/ajax/libs/jquery/1.7.2/jquery.min.js"></script>
        <script type="text/jаvascript">
            jQuery(document).ready(function(){
                jQuery("#nav li").hover(function(){
                    jQuery(this).find('ul:first').css({visibility: "visible",display: "none"}).slideDown(400);
                },function(){
                    jQuery(this).find('ul:first').css({visibility: "hidden"});
                });
            });
        </script>
Скачать 4126Загрузок 9,15 Kb
Демо

Комментарии

  • Facebook
  • Вконтакте

Похожие статьи