I haven't read your post any more than seeing the expression
"getElementsBySelector", but that alone prompts me to forward you to
this link in the api:
http://www.prototypejs.org/api/utility/dollar-dollar

That's the prototype way of doing what you're trying to do. Try it out
and if you have any further problems post back.

On Sep 18, 2:06 pm, banry <[EMAIL PROTECTED]> wrote:
> 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
-~----------~----~----~----~------~----~------~--~---

Reply via email to