выпадающее меню.
Есть вертикальное меню,которое появляется при нажатии на кнопку с любой вложеностю подкатегорий, и нужно его скрыть когда курсор выйдет из меню. через простенькую ф-цию я показываю меню....
файл script.js function show(id) { document.getElementById(id).style.display=''; } а вот скрыть выставляя display:none не получается, оно или вообще не закрывается или после выхода курсора с 1 пункта меню на другой закрывается (в зависимости куда вставить вызов ф-ции). вот код.... цсс menu_style.css Код:
#pmenu {padding:0; margin:25px 0 50px 15px; list-style-type: none; width:101px;} <html> <head> <title></title> <META http-equiv="Content-Type" content="text/html; charset=windows-1251"> <link rel="stylesheet" media="all" type="text/css" href="menu_style.css" /> <script type="text/javascript" src="script.js"></script> </head> <body bgcolor="#737994" text="#FFFFFF" link="#FFFFFF" topmargin="0" leftmargin="0"> <div class="conteiner1" style="border:1px solid #000000;"> <div class="button1"> <img onclick="show('menu')" src="button.gif"/> </div> <div id="menu" style="display: none;"> <!-- формат записи <ul class='tree_ul'> <li class='tree_li'><a href='' class='tree_a'></a> </ul> --> <ul id='pmenu' name='pmenu'> <li class="tree_li"><a href="" class="tree_a">1</a> <ul class="tree_ul" id="tree_ul"> <li class="tree_li"><a href="" class="tree_a">11</a> <li class="tree_li"><a href="" class="tree_a">12</a> <li class="tree_li"><a href="" class="tree_a">13</a> <li class="tree_li"><a href="" class="tree_a">14</a> <li class="tree_li"><a href="" class="tree_a">15</a> <li class="tree_li"><a href="" class="tree_a">16</a> <li class="tree_li"><a href="" class="tree_a">17</a> <ul class="tree_ul" id="tree_ul"> <li class="tree_li"><a href="" class="tree_a">171</a> <li class="tree_li"><a href="" class="tree_a">172</a> <li class="tree_li"><a href="" class="tree_a">173</a> </ul> <li class="tree_li"><a href="" class="tree_a">18</a> <li class="tree_li"><a href="" class="tree_a">19</a> </ul> </ul> </div></div> </body> </html> может кто знает как решить проблему? |
все ещё актуально....
|
во первых у вас тут как минимум два элемента с id="tree_ul"
это недопустимо. id должен быть ун икальным. во вторых. в приведенном коде ни единой строчки JS. display:none Должен срабатывать, если вы его правильно вызываете. тут нету ни куды, ни как вы вешаете обработчик. если проблема после выставления уник-id не решится, выкладывайте код JS ЗЫ апать тему было необязательно.вы очень нетерпеливы.вот,если бы за сутки никто не обратил бы внимания, тогда я еще понимаю. |
меню строится на пхп(сам код <ul><li>name </ul>), а цсс уже делает его выпадающим...тут яваскрипт ненужен для отображения,только показать-скрыть меню...что мне и нужно.
я могу конечно дописывать в построении списка каждому ul новое id, но ничего оно не даст... Цитата:
|
Цитата:
вешайте обработчик закрытия на onmouseover списков. при этом, для того, чтобы при переходе на другой список, меню не закрывалось, можете сделать закрытие меню отложенным при помощи setTimeOut, и чтобы в случае перевода курсора на другой элемент(заведите для этого флаг) меню не закрывалось.в ином случае хай закрывается. это есл я правильно понял логику, тчо вы хотите получить от меню |
как узнать Ид елемента под курсором...
|
напрямую никак(или я во всяком случае не знаю:D )
по моему это делается как-то так: у вас должен быть какой-нибудь флаг(переменная), которая свидетельствует о том, что вы еще в меню. назовем ее onmenu=false;//со старта false на событие элементов onmouseover ставим помимо выпадения меню(или оно у вас только по клику.тогда выпадение не ставим) ставим onmenu=true; на событие элементов onmouseout ставим конструкцию по типу var temp_func=function(){ if(!onmenu) //тут закрываем меню } setTimeout(temp_func,500); суть тут, в том, что через некоторое время уточняется состояние системы. |
заработало через jQuery hover()
|
и вы только ради этой плюшки решили подключить jQuery?
|
Часовой пояс GMT +3, время: 13:49. |