banry 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(){
A prototype way would be:
document.observe('dom:loaded', function(){
...
});
> alert('DOM is loaded!');
> element = $('menu')
> if(!element.hasClassName('disabled')) {
> var menu = new JMenu(element)
> document.menu = menu
Why not just:
document.menu = new JMenu(element);
> };
> });
>
>
> var JMenu = Class.create(); // added pd
> JMenu.prototype = { // added pd
Overwriting prototype property is not really necessary. Class.create
already does this for you:
Class.create({
initialize: function(){ ... },
...
});
>
> initialize: function(el){
> var elements = el.getElementsBySelector('li');
It's usually safer to extend element before using any prototypejs-
specific methods. `getElementsBySelector` is also deprecated.
var elements = $(el).select('li');
> alert(elements.length);
> var nested = null;
> for (var i = 0; i < elements.length; i++) {
If you're using plain `for(;;)`, then why not make it even faster by
not calculating `length` every time:
for (var i=0, l=elements.length; i<l; 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;
Did you want to get a first element in colleciton?
nested = element.select('ul').first();
// or even better
nested = element.select('ul')[0];
> 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")
Would be safer to "normalize" tagName before comparison:
if (node.nodeName.toLowerCase() === 'li') {
...
}
[snip the rest of the code]
Hope this helps.
--
kangax
--~--~---------~--~----~------------~-------~--~----~
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 [email protected]
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
-~----------~----~----~----~------~----~------~--~---
