[prototype] menu effect

[buribus]

Mi sono proposto di trasformare uno semplice script per jquery per renderlo compatibile con prototype e scriptaculous che abitualmente uso. Si tratta di un menu ( l' esempio di alistapart è stato postato anche su edit) con degli effetti visivi accattivanti.

Sono parzialmente riuscito nell'intento ma c'è qualche problema: passando compilsivamente più volte sullo stesso link (farlo velocemente), lo script va in errore e il link si blocca sullo stato hover.

ecco la pagina del mio test
ed ecco il codice js:

function initNav() {
    $$("ul#navigation li").each(function(element) {
                        
            var button = element.down("a");
            
            var buttonClass = button.readAttribute("class");

            if (buttonClass != "selected") {
                button.setStyle({background:"none"});
            }
            
            button.observe('mouseover', function() {
                element.insert('<span></span>');
                element.down(1).hide().appear({ duration: 0.5 });
            
            }.bindAsEventListener(element))//click observe
            
            button.observe('mouseout', function() {            
                this.next().fade({ duration: 0.5, delay:0.5, afterFinish: function(effect) { Element.remove(effect.element) } });
            
            })//click observe
            
    });    
}    
    
document.observe ('dom:loaded', initNav, false); 

Qualche idea?

[buribus]

credo di aver risolto cambiando il codice sopra così:

button.observe('mouseover', function() {
                if (!(element.down(1))) {
                    element.insert('<span></span>');
                    element.down(1).hide().appear({ duration: 0.5 });
                }
            }.bindAsEventListener(element))//click observe