lepota 3 Опубликовано: 28 ноября 2017 Рассказать Опубликовано: 28 ноября 2017 (изменено) Подскажите пожалуйста. Есть горизонтальное меню Цитата <li><a class="menu-link" href="/">Главная</a><img src="{THEME}/images/menu.png" alt="" /> <li><a class="menu-link" href="/">Вторая</a><img src="{THEME}/images/menu.png" alt="" /> есть стили меню и выпадающего меню Цитата /*Меню - футер*/ .footer{border-bottom:2px solid #BDBCB8;} ul#footer-m {list-style-type:none; margin:0; padding:0px 0px 0px 20px;} ul#footer-m li a{ display:block; line-height:15px; text-decoration:none; color:#434343;} ul#footer-m li a:hover{ color:#91606E; text-decoration:underline;} .f-m{ float:left; width:140px;} .foot {color:#999;padding:10px;} .foot a {color:#999;font-weight: bold;} .foot a:hover {color:#91606E;} /*Выпадающее меню*/ .menu{height: 45px;position: relative;z-index: 1000;width:1024px;float: left;} .menu-link{display: block;height: 35px;font: bold 11px Tahoma;color: #fff;line-height: 35px;padding: 0 10px;float: left; text-transform:uppercase; text-decoration:none;} .menu ul{margin: 0;padding: 0;} .menu-link:hover{color: #fff;} .activ{color: #dddddd;} .menu li{list-style-type: none;float: left;position: relative;height: 40px;z-index: 1000;color: #999999;line-height: 35px;} .hidden-menu{display: none;background: url(../images/bg-hidden-menu.jpg) 0 0 repeat;position: absolute;top: 35px;left: 0px;width: 140px;z-index: 100;padding: 10px 0 20px 18px;border-radius: 0 0 5px 5px;-mos-border-radius: 0 0 5px 5px;-webkit-border-radius: 0 0 5px 5px;} .menu-h{display: block;width: 120px;height: 30px;font: bold 12px Tahoma;color: #fff;line-height: 30px;padding: 0 0 0 3px;background: url(../images/hidden-line.png) 0 bottom repeat-x; text-decoration:none;} .menu-h:hover{color:#dcdcdc; text-decoration:underline;} прописал вот так: Цитата <div class="menu"> <ul> <li><a class="menu-link" href="/">Главная</a><img src="{THEME}/images/menu.png" alt="" /> <ul> <li><a href="#">ссылка 1</a></li> <li><a href="#">ссылка 2</a></li> </ul> </li> </div> Чего то не пашет. Подскажите как прописать правильно что бы выпадающее было.... Изменено 28 ноября 2017 пользователем lepota Цитата Ссылка на сообщение Поделиться на других сайтах
master27 38 Опубликовано: 28 ноября 2017 Рассказать Опубликовано: 28 ноября 2017 54 минуты назад, lepota сказал: Чего то не пашет. есть подозрение, что ещё и скрипты должны быть. Цитата Ссылка на сообщение Поделиться на других сайтах
lepota 3 Опубликовано: 28 ноября 2017 Рассказать Опубликовано: 28 ноября 2017 Автор скрипт вот этот Цитата $(document).ready(function() { $('.menu li').hover( function() { $(this).find('.hidden-menu').css({'display':'block'}); $(this).find('.menu-link').addClass('activ'); }, function() { $(this).find('.hidden-menu').css({'display':'none'}); $(this).find('.menu-link').removeClass('activ'); }); /*********************************************/ var sliderTime = 8000; $('.slaider-block-all:first').addClass('slaider-activ').find('.slaider-block-news').fadeIn(); function showSliderItem() { clearTimeout(timerId); var currentBlock = $('.slaider-activ'); var nextBlock = currentBlock.next('.slaider-block-all').length ? currentBlock.next('.slaider-block-all') : $('.slaider-block-all:first'); currentBlock.find('.slaider-block-news').fadeOut(); $('.slaider-block-all').removeClass('slaider-activ'); nextBlock.addClass('slaider-activ').find('.slaider-block-news').fadeIn(); nextBlock.addClass('slaider-activ').fadeIn(800, function () { timerId = setTimeout(showSliderItem, sliderTime); }); return false; } function showCurrent() { clearTimeout(timerId); $('.slaider-block-all').removeClass('slaider-activ'); $('.slaider-block-news').fadeOut(); $(this).parent().addClass('slaider-activ').find('.slaider-block-news').fadeIn(); timerId = setTimeout(showSliderItem, sliderTime); } $('.slaider-block-news-mini').click(showCurrent); timerId = setTimeout(showSliderItem, sliderTime); }); $(function() { $( "#logindialog" ).dialog({ autoOpen: false, show: 'fade', hide: 'fade', width: 300 }); $('#loginlink').click(function(){ $('#logindialog').dialog('open'); return false; }); }); Цитата Ссылка на сообщение Поделиться на других сайтах
master27 38 Опубликовано: 28 ноября 2017 Рассказать Опубликовано: 28 ноября 2017 ну, смотрите консоль браузера на предмет ошибок, почему не выполняется код.. $('.menu li').hover( function() { $(this).find('.hidden-menu').css({'display':'block'}); $(this).find('.menu-link').addClass('activ'); }, function() { $(this).find('.hidden-menu').css({'display':'none'}); $(this).find('.menu-link').removeClass('activ'); }); Цитата Ссылка на сообщение Поделиться на других сайтах
lepota 3 Опубликовано: 28 ноября 2017 Рассказать Опубликовано: 28 ноября 2017 Автор а зачем там скрипт? ведь можно без всяких скриптов сделать. Так и не разобрался "как все таки она вертится?" Цитата Ссылка на сообщение Поделиться на других сайтах
germanydletest 442 Опубликовано: 28 ноября 2017 Рассказать Опубликовано: 28 ноября 2017 https://habrahabr.ru/company/mr_gefest/blog/273907/ https://ruseller.com/lessons.php?rub=2&id=1442 выбирай, не хочу Цитата Ссылка на сообщение Поделиться на других сайтах
lepota 3 Опубликовано: 28 ноября 2017 Рассказать Опубликовано: 28 ноября 2017 Автор таких менюшек дополна, но со стилями и как вписать, это проблема. Цитата Ссылка на сообщение Поделиться на других сайтах
Рекомендованные сообщения
Присоединяйтесь к обсуждению
Вы можете опубликовать сообщение сейчас, а зарегистрироваться позже. Если у вас есть аккаунт, войдите в него для написания от своего имени.