Smårusk i Mootools-dropdownmeny

[homrJ]

Har lekt litt med å lage en egen dropdownmeny på et par sider, og har brukt JavaScript-biblioteket Mootools.

Eksempel på implementering av menyen

Om man beveger musepekeren litt inn og ut av en dropdown, begynner menyen å oppføre seg rart... Noen som har noen erfaring med Mootools/JavaScript/dropdowns som har lyst til å se om de ser noe galt? Evt bedre måter å gjøre dette på..

Her er JavaScriptet:

Kode: Merk alt

var effects = new Array();

window.addEvent('domready', function() {
    var meny = $('myajaxmenu');
    var topitems = meny.getChildren().filterByTag('li');
   
    topitems.each(function(el) {
        var submenu = el.getElement('ul');
        if ($defined(submenu)) {
            var i = effects.length;
            var origHeight = submenu.getSize().size.y;
            var duration = Math.round(origHeight / 21 * 500);
           
            effects[i] = new Fx.Style(submenu, 'height', {wait:false, duration:500});
           
            submenu.setStyle('height', 0);
           
            el.addEvent('mouseenter', function () {
                effects[i].start(origHeight);
            });
           
            el.addEvent('mouseleave', function () {
                effects[i].start.delay(800, effects[i], 0);
            }); //.delay(1500));
        }
    });
});

[decodex]

Er ikke spesifikt så kjent med mootools-biblioteket. Men to umiddelbare kommentarer etter en kjapp titt:

1. Virker ikke som du tar i bruk den relative tidsperioden for hver animasjon (duration-variabelen). Mitt inntrykk når jeg sjekket siden var generelt at animasjonen er overdrevent langsom og 500ms som utgangspunkt er relativt mye etter min mening.

2. Problemet har nok sin rot i at du antar at det ikke pågår en animering av undermenyen fra før når du forsøker lukke/åpne den. Jeg er som sagt ikke helt kjent med mootools, men jeg vil tro du bør stoppe en pågående animasjon før du starter en annen på samme element. Kanskje har mootools en måte å se om en effekt er aktiv? Og i så fall stoppe før nytt kall på start().

[homrJ]

Takk for svar.

Har allerede prøvd å legge inn

Kode: Merk alt

effects[i].stop();

før jeg starter hver effekt, men det har ingen betydning. Skal prøve noen andre løsninger i samme gate, og evt. omstrukturere koden litt.

Har du forresten noen anbefalinger mht. andre js-biblioteker enn mootools? Har lagt merke til jQuery bl.a., men ikke satt meg noe inn i det...