Problems with JS drop down menu in IE 6;7

[wonderland]

Hi, I'm having a small problem with JS drop down menu. The problem occurs only in IE6 and IE7 (surprisingly in IE8 everything works fine).

The problem isn't big though. when you put pointer over drop down in IE, the drop down part loads 2/3 of drop down and in a moment loads other part. It's nothing big but is noticeable.

if you have IE6;7 and any other browser you can compare it here: http://www.omtk.lv/

var menu=function(){
	var t=15,z=50,s=6,a;
	function dd(n){this.n=n; this.h=[]; this.c=[]}
	dd.prototype.init=function(p,c){
		a=c; var w=document.getElementById(p), s=w.getElementsByTagName('ul'), l=s.length, i=0;
		for(i;i<l;i++){
			var h=s[i].parentNode; this.h[i]=h; this.c[i]=s[i];
			h.onmouseover=new Function(this.n+'.st('+i+',true)');
			h.onmouseout=new Function(this.n+'.st('+i+')');
		}
	}
	dd.prototype.st=function(x,f){
		var c=this.c[x], h=this.h[x], p=h.getElementsByTagName('a')[0];
		clearInterval(c.t); c.style.overflow='hidden';
		if(f){
			p.className+=' '+a;
			if(!c.mh){c.style.display='block'; c.style.height=''; c.mh=c.offsetHeight; c.style.height=0}
			if(c.mh==c.offsetHeight){c.style.overflow='visible'}
			else{c.style.zIndex=z; z++; c.t=setInterval(function(){sl(c,1)},t)}
		}else{p.className=p.className.replace(a,''); c.t=setInterval(function(){sl(c,-1)},t)}
	}
	function sl(c,f){
		var h=c.offsetHeight;
		if((h<=0&&f!=1)||(h>=c.mh&&f==1)){
			if(f==1){c.style.filter=''; c.style.opacity=1; c.style.overflow='visible'}
			clearInterval(c.t); return
		}
		var d=(f==1)?Math.ceil((c.mh-h)/s):Math.ceil(h/s), o=h/c.mh;
		c.style.opacity=o; c.style.filter='alpha(opacity='+(o*100)+')';
		c.style.height=h+(d*f)+'px'
	}
	return{dd:dd}
}();

[Airshow]

Wonderland,

Good and bad news - I can't replicate the problem. Even the longest menu - Koledza (6 items) - load smoothly all the way to the bottom.

These artifacts can be mother-board/graphics-card dependant. Some hardware handles visual effects better than others.

My guess is that you won't improve it with code changes, but stand by for someone who knows better.

Airshow

[wonderland]

That actually was my first guess, I just couldn't believe that such small menu could be so hardware dependent.
Thanks for confirming it though. :)

p.s it seems that older laptops experience this the most. I tried my PC, had no problems.

p.p.s I added image (taken from laptop on IE7) for a small moment it looks like this, afterward everything loads :
[IMG]http://i52.photobucket.com/albums/g9/Rydra/uldisdarbs.jpg[/IMG]

[Airshow]

That's very odd. I wasn't expecting a lateral clip!

It clealy clips to the line of the adjacent menu, Vidusskola.

I wonder, does it clip if Koledza is the first menu visited after refreshing the page? Or must Vidusskola be already visited for clipping to occur? (Just out of interest, because I still think you are unlikely to be able to do anything about it).

Airshow

[wonderland]

Yes, it clips even if Koledza is the first menu visited after refreshing the page.

But in css there is a rule where width of drop down is defined.

[Airshow]

Something to try:

In the wrapper function menu initialise z to a large integer, say 99999, then in dd.prototype.st change z++; to z--; .

This will ensure that each menu is tucked underneath its left neighbour rather than sitting on top of it.

Could help.

Airshow