I'm trying to convert some code from mootools to prototype, but I can get the first ul to work but none of the others add the hover class on mouseover. its got something to do with the call to getElementBySelector - any help appreciated
Event.onDOMReady(function(){ alert('DOM is loaded!'); element = $('menu') if(!element.hasClassName('disabled')) { var menu = new JMenu(element) document.menu = menu }; }); var JMenu = Class.create(); // added pd JMenu.prototype = { // added pd initialize: function(el){ var elements = el.getElementsBySelector('li'); alert(elements.length); var nested = null; for (var i = 0; i < elements.length; i++) { var element = elements[i]; //alert(elements.length); Event.observe(element, 'mouseover', function(){ this.addClassName('hover'); }); Event.observe(element, 'mouseout', function(){ this.removeClassName('hover'); }); //find nested UL //nested = $E('ul', element); nested = element.getElementsBySelector('ul').first; if (!nested) { continue; } //declare width var offsetWidth = 0; //find longest child for (k = 0; k < nested.childNodes.length; k++) { var node = nested.childNodes[k] if (node.nodeName == "LI") offsetWidth = (offsetWidth >= node.offsetWidth) ? offsetWidth : node.offsetWidth; } //match longest child for (l = 0; l < nested.childNodes.length; l++) { var node = nested.childNodes[l] if (node.nodeName == "LI") { $(node).setStyle('width', offsetWidth + 'px'); } } $(nested).setStyle('width', offsetWidth + 'px'); } } }; <div id="module-menu"> <ul id="menu"> <!--<li class="node"><a>Tasks</a></li>--> <li class="node"><a>Organisation</a> <ul> <li><a href="/companies" class="icon-16-cpanel">Companies</a></ li> <li class="separator"><span></span></li> <li><a href="/business_streams" class="icon-16- cpanel">Business_streams</a></li> <li class="separator"><span></span></li> <li><a href="/employees" class="icon-16-user">Employees</a></li> <li class="separator"><span></span></li> <li><a href="/users" class="icon-16-user">Users</a></li> <li class="separator"><span></span></li> <li><a href="/roles" class="icon-16-user">Roles</a></li> <li class="separator"><span></span></li> <li><a href="/periods" class="icon-16-cpanel">Periods</a></li> <li class="separator"><span></span></li> <li><a href="/accounts" class="icon-16-cpanel">Accounts</a></li> <li class="separator"><span></span></li> <li><a href="/cost_centres" class="icon-16-cpanel">Cost Centres</ a></li> <li class="separator"><span></span></li> <li><a href="/cost_centre_accounts" class="icon-16-cpanel">Cost Centre Accounts</a></li> <li class="separator"><span></span></li> <li><a href="/hierarchies" class="icon-16-cpanel">Hierarchies</ a></li> <li class="separator"><span></span></li> </ul> </li> <li class="node"><a>System Setup</a> <ul> <li><a href="/transaction_types" class="icon-16- cpanel">Transaction Types</a></li> <li class="separator"><span></span></li> <li><a href="/reconciliation_types" class="icon-16- cpanel">Reconciliation Types</a></li> <li class="separator"><span></span></li> <li><a href="/reconciliation_sub_types" class="icon-16- cpanel">Reconciliation Sub Types</a></li> </ul> </li> <li class="node "><a>Reconciliation</a> <ul> <li><a href="/reconciliation_responses" class="icon-16- cpanel">Reconciliation Responses</a></li> </ul> </li> <li class="node"><a>Help</a></li> </ul> </div> --~--~---------~--~----~------------~-------~--~----~ You received this message because you are subscribed to the Google Groups "Prototype & script.aculo.us" group. To post to this group, send email to prototype-scriptaculous@googlegroups.com To unsubscribe from this group, send email to [EMAIL PROTECTED] For more options, visit this group at http://groups.google.com/group/prototype-scriptaculous?hl=en -~----------~----~----~----~------~----~------~--~---