HTML+CSS+JavaScript

Привет! не могу разобраться :(

данный код открывает меню при нажатии, структура меню обычная:

<ul> <li> <a href=""></a>  <ul>  <li><a href=""></a></li>  <li><a href=""></a></li>  <li><a href=""></a></li>  </ul>  </li>

код который с помощью Jquery при нажатии на заголовок раскрывает список ссылок вот такой:

function initMenu() {   $('#menu-sidebar ul').hide();   $('#menu-sidebar ul:first').hide();      $('#menu-sidebar li a').click(     function() {       var checkElement = $(this).next();       if((checkElement.is('ul')) && (checkElement.is(':visible'))) {         return false;         }       if((checkElement.is('ul')) && (!checkElement.is(':visible'))) {         $('#menu-sidebar ul:visible').slideUp('normal');         checkElement.slideDown('normal');         return false;         }       }     );   } $(document).ready(function() {initMenu();}); current-menu-item

когда мы заходим в раздел то ему присваивается класс: current-menu

как сделать чтобы меню оставалось открытым если есть класс current-menu?

ставьте проверку $(...).hasClass('current-menu')

но лучше вот такой скрипт возьмите:

var timeout    = 500; var closetimer = 0; var ddmenuitem = 0; function jsddm_open(){       jsddm_canceltimer();     jsddm_close();     ddmenuitem = $(this).find('ul').show() } function jsddm_close(){       if(ddmenuitem) ddmenuitem.hide() } function jsddm_timer(){     closetimer = window.setTimeout(jsddm_close, timeout); } function jsddm_canceltimer(){     if(closetimer){           window.clearTimeout(closetimer);           closetimer = null;     } } $(function(){     $('.menu > li').bind('mouseover', jsddm_open)     $('.menu > li').bind('mouseout', jsddm_timer)     document.onclick = jsddm_close;            }) <ul class="menu ">  <li>  <a href=""></a>   <ul>   <li><a href=""></a></li>   <li><a href=""></a></li>   <li><a href=""></a></li>   </ul>   </li>

>> ставьте проверку $(...).hasClass('current-menu')

извините можно чуть по подробнее какое условие должно быть ?

if($("селектор").hasClass('current-menu')){
// ничего не делаем
}else{
// прячем
}

этож PHP ?

jquery

прошу прощения за наглость, не могу разобраться, не могли бы вы привести полный код?

рабочий код смотрите
автор: AlexSol (01.07.2011 в 11:46)

относительно вашего скрипта - у вас нет даже намека на такую проверку и в каком именно месте она вам нужна я угадать не могу

так и не вышло, не получается написать условие вида:

Если у LI есть калссы current-menu-item или current-menu-ancestor то оставляем открытым, иначе закрываем...

<ul id="menu-sidebar">  <li class="current-menu-item current-menu-ancestor">  <a href=""></a>   <ul>   <li><a href=""></a></li>   <li><a href=""></a></li>   <li><a href=""></a></li>   </ul>   </li>

по коду обработчика пока что есть только такой:

function initMenu() {    $('#menu-sidebar ul').hide();    $('#menu-sidebar ul:first').hide();        $('#menu-sidebar li a').click(      function() {        var checkElement = $(this).next();        if((checkElement.is('ul')) && (checkElement.is(':visible'))) {          return false;          }        if((checkElement.is('ul')) && (!checkElement.is(':visible'))) {          $('#menu-sidebar ul:visible').slideUp('normal');          checkElement.slideDown('normal');          return false;          }        }      );    }  $(document).ready(function() {initMenu();});

может кто знает как реализовать? :(

function initMenu() {     $('#menu-sidebar ul').hide();     //$('#menu-sidebar ul:first').hide();  лишнее        $('#menu-sidebar li a').click(       function() {         var checkElement = $(this).next();       var li =   $(this).parent()       if((checkElement.is('ul')) && (checkElement.is(':visible'))) {           return false;           }         if((checkElement.is('ul')) && (!checkElement.is(':visible'))) {              if(li.hasClass('current-menu-item')||li.hasClass('current-menu-ancestor'))                        }else{              $('#menu-sidebar ul:visible').slideUp('normal');              }               checkElement.slideDown('normal');           return false;           }         }       );     }   $(document).ready(function() {initMenu();});

теперь все меню просто раскрылось :(

<ul id="menu-sidebar">       <li class="current-menu-item">       <a href="#">1</a>        <ul>            <li><a href="#">2</a></li>            <li><a href="#">3</a></li>            <li><a href="#">4</a></li>        </ul>        </li>      <li>       <a href="#">2</a>        <ul>            <li><a href="#">22</a></li>            <li><a href="#">32</a></li>            <li><a href="#">42</a></li>        </ul>        </li>  </ul> <script type="text/javascript">         $(document).ready(function() {         $('#menu-sidebar li').not('.current-menu-item').find('ul').hide();            $('#menu-sidebar li a').click(function() {             $(this).next().slideToggle();         });        });   </script>

Ваш вариант тоже не работает :(
меню не остается открытым
и при нажатии на UL теперь оно открывается и сразу закрывается

Если вы вставляете мой вариант на отдельной странице, без всяких дополнительных скриптов (кроме jQuery конечно) - он не работает?

Открывается и сразу закрывается потому что у вас где-то еще один обработчик "меню" запущен.

Большое спасибо работает на пустом файле, буду проверять что мешает
Всегда знаю что можно найти помощь специалистов на Softtime! :)

итоговый код

$(document).ready(function() {          $('#menu-sidebar li').not('.current-menu-item, .current-menu-ancestor').find('ul').hide();             $('#menu-sidebar li a').click(function() {              $(this).next().slideToggle();          });         });

p.s. меню делалось для wordpress

Я не посмотрел что у вас еще один класс есть, при котором он открытым остатся должен. Вот такой финальный вариант:

$(document).ready(function() {         $('#menu-sidebar li:not(.current-menu-item, .current-menu-ancestor) ul').hide();            $('#menu-sidebar li a').click(function() {             $(this).next().slideToggle();             return false;         });        });

PS: пока писал вы меня опередили)
PSS: вероятно нужно будет добавить return false; т.к. иначе будет переходить по ссылке