Нужна помощь со скриптом для "Dropline" меню
Всем привет! Я в javascript полный ноль, поэтому ничего в голову лучше не пришло чем задать вопрос здесь...
Ниже привожу код - это так званое "dropline" меню, сам javascript взят из платного шаблона, но что-то не работает - при наведении мышки не выскакивают ссылки подменю :confused: . Помогите найти ошибку, если это возможно, заранее благодарен. <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd"> <html xmlns="http://www.w3.org/1999/xhtml"> <head> <title></title> <meta http-equiv="Content-Type" content="text/html; charset=windows-1251" /> <script type="text/javascript"> function addEvent(obj, evType, fn){ if (obj.addEventListener){ obj.addEventListener(evType, fn, false); return true; } else if (obj.attachEvent){ var r = obj.attachEvent("on"+evType, fn); return r; } else { return false; } } var delay = 1000 var current = null var recover = null var timeoutid = null var timetorecover = null var timeoutid2 = 0 function initScriptDLMenu() { current = activemenu[0] mainlis = document.getElementById("mainnav").getElementsByTagName("li") for (i=0; i<mainlis.length; ++i) { x = mainlis[i] menuindex = x.id.substr(13) x._id = parseInt(menuindex) x.onmouseover = mouseOver x.onmouseout = mouseOut subx = document.getElementById("subnav"+menuindex) if (subx) { if (activemenu[0] && menuindex == activemenu[0]) { subx.style.display = "block" }else{ subx.style.display = "none" } subx._id = menuindex subx.onmouseover = mouseOver subx.onmouseout = mouseOut } } //Set active item if (activemenu[0]) { actitem = document.getElementById("mainnav"+activemenu[0].toString()) if (actitem) { if (actitem.className) actitem.className += " active"; else actitem.className = "active"; } recover = activemenu[0] } if (activemenu[1]) { actitem = document.getElementById("subnavitem"+activemenu[1].toString()) if (actitem) { if (actitem.className) actitem.className += " active"; else actitem.className = "active"; } } } function mouseOver () { hide() current = this._id show() clearTimeOut(timeoutid) } function mouseOut () { if (this._id != current) return timeoutid = setTimeout('restore()', delay) } function restore () { clearTimeOut(timeoutid) hide() if (recover) { current = recover show() } } function setHover () { if (current == recover) return mainx = document.getElementById("mainnav"+current.toString()) if (mainx) mainx.className += ' hover'; } function clearHover () { if (current == recover) return mainx = document.getElementById("mainnav"+current.toString()) if (mainx) mainx.className = mainx.className.replace(/[ ]?hover/, ''); } function hide () { subx = document.getElementById("subnav"+current.toString()) if (subx) subx.style.display = "none" clearHover () } function show () { subx = document.getElementById("subnav"+current.toString()) if (subx) subx.style.display = "block" setHover () } function clearTimeOut(timeoutid){ clearTimeout(timeoutid) timeoutid = 0 } addEvent(window, 'load', initScriptDLMenu) </script> </head> <body> <div id="mainnav"> <ul> <li id="mainnav1"><a href="http://site.ru/">Главная</a></li> <li id="mainnav3"><a href="http://site.ru/1/index.html">Раздел 1</a></li> <li id="mainnav4"><a href="http://site.ru/2/index.html">Раздел 2</a></li> <li id="mainnav5"><a href="http://site.ru/3/index.html">Раздел 3</a></li> <li id="mainnav6" class="havechild"><a href="http://site.ru/4/index.html">Раздел 4</a></li> <li id="mainnav7" class="havechild"><a href="http://site.ru/5/index.html">Раздел 5</a></li> </ul> </div> <div id="subnav"> <ul id="subnav6"> <li id="subnavitem10"><a href="http://site.ru/6/index.html">Подраздел 1</a></li> </ul> <ul id="subnav7"> <li id="subnavitem11"><a href="http://site.ru/7/index.html">Подраздел 2</a></li> <li id="subnavitem9"><a href="http://site.ru/8/index.html">Подраздел 3</a></li> </ul> </div> <script type="text/javascript"> var activemenu = new Array("1"); </script> </body> </html> |
Все тоже самое, но с префиксами "jadsl-" к идентификаторам - прекрасно работает... Не пойму в чем секрет, помогите люди добрые :) !
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd"> <html xmlns="http://www.w3.org/1999/xhtml"> <head> <title></title> <meta http-equiv="Content-Type" content="text/html; charset=windows-1251" /> <script type="text/javascript"> function addEvent(obj, evType, fn){ if (obj.addEventListener){ obj.addEventListener(evType, fn, false); return true; } else if (obj.attachEvent){ var r = obj.attachEvent("on"+evType, fn); return r; } else { return false; } } var delay = 1000 var current = null var recover = null var timeoutid = null var timetorecover = null var timeoutid2 = 0 function initScriptDLMenu() { current = activemenu[0] mainlis = document.getElementById("jasdl-mainnav").getElementsByTagName("li") for (i=0; i<mainlis.length; ++i) { x = mainlis[i] menuindex = x.id.substr(13) x._id = parseInt(menuindex) x.onmouseover = mouseOver x.onmouseout = mouseOut subx = document.getElementById("jasdl-subnav"+menuindex) if (subx) { if (activemenu[0] && menuindex == activemenu[0]) { subx.style.display = "block" }else{ subx.style.display = "none" } subx._id = menuindex subx.onmouseover = mouseOver subx.onmouseout = mouseOut } } //Set active item if (activemenu[0]) { actitem = document.getElementById("jasdl-mainnav"+activemenu[0].toString()) if (actitem) { if (actitem.className) actitem.className += " active"; else actitem.className = "active"; } recover = activemenu[0] } if (activemenu[1]) { actitem = document.getElementById("jasdl-subnavitem"+activemenu[1].toString()) if (actitem) { if (actitem.className) actitem.className += " active"; else actitem.className = "active"; } } } function mouseOver () { hide() current = this._id show() clearTimeOut(timeoutid) } function mouseOut () { if (this._id != current) return timeoutid = setTimeout('restore()', delay) } function restore () { clearTimeOut(timeoutid) hide() if (recover) { current = recover show() } } function setHover () { if (current == recover) return mainx = document.getElementById("jasdl-mainnav"+current.toString()) if (mainx) mainx.className += ' hover'; } function clearHover () { if (current == recover) return mainx = document.getElementById("jasdl-mainnav"+current.toString()) if (mainx) mainx.className = mainx.className.replace(/[ ]?hover/, ''); } function hide () { subx = document.getElementById("jasdl-subnav"+current.toString()) if (subx) subx.style.display = "none" clearHover () } function show () { subx = document.getElementById("jasdl-subnav"+current.toString()) if (subx) subx.style.display = "block" setHover () } function clearTimeOut(timeoutid){ clearTimeout(timeoutid) timeoutid = 0 } addEvent(window, 'load', initScriptDLMenu) </script> </head> <body> <div id="jasdl-mainnav"> <ul> <li id="jasdl-mainnav1"><a href="http://site.ru/">Главная</a></li> <li id="jasdl-mainnav3"><a href="http://site.ru/1/index.html">Раздел 1</a></li> <li id="jasdl-mainnav4"><a href="http://site.ru/2/index.html">Раздел 2</a></li> <li id="jasdl-mainnav5"><a href="http://site.ru/3/index.html">Раздел 3</a></li> <li id="jasdl-mainnav6" class="havechild"><a href="http://site.ru/4/index.html">Раздел 4</a></li> <li id="jasdl-mainnav7" class="havechild"><a href="http://site.ru/5/index.html">Раздел 5</a></li> </ul> </div> <div id="jasdl-subnav"> <ul id="jasdl-subnav6"> <li id="jasdl-subnavitem10"><a href="http://site.ru/6/index.html">Подраздел 1</a></li> </ul> <ul id="jasdl-subnav7"> <li id="jasdl-subnavitem11"><a href="http://site.ru/7/index.html">Подраздел 2</a></li> <li id="jasdl-subnavitem9"><a href="http://site.ru/8/index.html">Подраздел 3</a></li> </ul> </div> <script type="text/javascript"> var activemenu = new Array("1"); </script> </body> </html> |
Просто в самом начале скрипта применяется метод substr(), с позиции = 13. Т.е. если вы в строке menuindex = x.id.substr(13) измените число на 7, ваш скрипт должен заработать без префикса "jadsl-" в id элементов.
|
Огромное спасибо за помощь! Смогу теперь спокойно уснуть :) ...
|
Цитата:
|
Ну бегло просмотрев скрипт, я заметил только одно место где могла бы находиться загвоздка. А учитывая то что автор просто не хотел видеть префикс 'jadsl-' в id своих элементов я предложил самое простое решение. Т.е. в том месте скрипта где получают номер элемента меню методом substr() изменить позицию в которой должен находиться этот номер :) , а без учета того самого префикса она составила 7.
В вообще, можно было бы переделать скрипт и заменить место опредления номера элемента с метода substr() на что нибудь более универсальное (например поиск по регулярному выражению числа, тогда бы и не пришлось заморачиваться с индексами строки :) ) |
Часовой пояс GMT +3, время: 05:31. |