webForumDet fria alternativet

Slidedown meny

2 svar · 380 visningar · startad av programmer3

programmer3Medlem sedan juli 20093 inlägg
#1

Hej!

Jag håller på att utveckla en webbutik.

Till butiken hör en meny på vänster sida med huvudkategorier och underkategorier. När man klickar på en huvudkategori så ska underkategorierna "slides" ner lite snyggt.

Jag har därför pulat ihop ett litet javascript som ändrar höjden på den div som innehåller underkategorierna. Detta med hjälp av funktionen setInterval/clearInterval i JS.

Problemet
Nu när jag testar menyn i olika webbläsare och på olika datorer så rullas menyn fram i olika tempo. Vad beror det på? Kan jag få menyn att ha samma "speed" oavsett dator eller webbläsare (ex ie och firefox)? Det skiljer nästan en sekund ibland.

Klipper jag ut själva menyn ur sidan och har den på en separat sida (med bara meny och inget annat) så verkar den "slida" lika fort oavsett dator.

Kod:


   var c=0;
   var test=true;
   var obj,obj1,obj2,hgt,exp,shr;

function showHideMenu(layerid,items) {

   hgt=(items*20)+10;

var test = document.getElementById('menuLayer' + layerid).style.height;

test = parseInt(test.replace("px", ""));

c=test;

if(c=='') { c=0; }

if(test > 0) {

   document.getElementById('menuImg' + layerid).src="/_images/buttons/plus.gif";
   shr=setInterval('shrinkDiv('+layerid+','+items+')',10);

}else{

   document.getElementById('menuImg' + layerid).src="/_images/buttons/minus.gif";
   exp=setInterval('expandDiv('+layerid+','+items+')',10);

}

}

function expandDiv(layerid, items) {
    document.getElementById('menuLayer' + layerid).style.height=c+'px';

   c+=10;
if(c>=hgt) {
   c=hgt;
   clearInterval(exp);
   return;
 }

 }

function shrinkDiv(layerid, items) {
    document.getElementById('menuLayer' + layerid).style.height=c+'px';

   c-=10;
if(c<0) {
   c=0;
   clearInterval(shr);
    document.getElementById('menuLayer' + layerid).style.height=0;
   return;
 }

 }

/Joel

StefanBergfeldtMedlem sedan sep. 2004828 inlägg
#2

Allra enklast är ju att kika på jQuerys slideUp och slideDown för att göra detta. Där är problemet med olika webbläsare redan löst.

programmer3Medlem sedan juli 20093 inlägg
#3

Nu kör vi med jQuery's slideup/slidedown och det fungerar mycket bättre! :)

/Joel

132 ms totalt · 3 externa anrop · v20260731065814-full.3ab8d573
0 ms — hämta forumlista (cache)
0 ms — hämta statistik (cache)
129 ms — hämta tråd, inlägg och bilagor (db)