IE9 probleem

[hawky]

Ik gebruik dit script om onderaan op het scherm balkjes te laten verschijnen en te laten bewegen:

$(document).ready(function() {
	$aantalbars = parseFloat((document.width)/13).toFixed(0);
	$rood = Math.round(4 + ((9 - 4)*(Math.random() % 1)));
	for( i=0; i < $aantalbars - 1 ; i++){
		if(i==$rood){
			$("#eq").append("<span class='bar rood'></span>");
			$rood = i + Math.round(4 + ((9 - 4)*(Math.random() % 1)));
		}
		else{
			$("#eq").append("<span class='bar'></span>");					
		}
	}	
	$(".bar").each(function(i) {
	    fluctuate($(this));
	});
});

function fluctuate(bar) {
    var hgt = Math.random() * 200;
    hgt += 1;
    var t = hgt * 10;
    
    bar.animate({
        height: hgt
    }, t, function() {
        fluctuate($(this));
    });
}

Zoals op deze pagina: http://sharingbook.co.cc/Hottrax/
Maar dit script werkt niet meer in IE9, weet iemand de oplossing?

Alvast bedankt,
Brecht

 

[coenraad]

IE8 weer funtioneel maken.
IE9 heeft nog enkele "bugs"

 

[csshunter]

Hoi Brecht,
Niet alleen IE9 heeft het probleem, ook IE7. En met aan zekerheid grenzende waarschijnlijkheid: ook IE8 zal het niet doen: geen enkele IE.

Oorzaak: IE kan niet goed omgaan met de eigenschap document.width.
Wel met bv. de offsetWidth van de body.
Dus:
[JS]...
$aantalbars = parseFloat((document.width)/13).toFixed(0);
...[/JS]
moet gaat worden:
[JS]...
$aantalbars = parseFloat((document.getElementsByTagName('body')[0].offsetWidth)/13).toFixed(0);
...[/JS]
Nu luistert IE wel.

• Test: www.developerscorner.nl/csshunter/tests/hottrax-nw.htm
• De andere dingen heb ik uitgezet, want de images blijken niet over te komen als je niet via sharingbook.co.cc opereert.
• Er zitten ook nog wat foei-foutjes in de html, zoals een <div> binnen een <a> enzo.

Het script is trouwens een ver-schrik-ke-lij-ke veelvraat: bij mij (met niet de modernste kast, maar dat zal meer bezoekers overkomen) slurpt de pagina permanent ca. 52% van mijn processorkracht. :shocked:
Ik kan 'm dus niet eens tegelijkertijd in Firefox en IE hebben openstaan!
- Misschien is ergens een andere oplossing voor ongeveer hetzelfde effect te vinden, met minder gewicht?

Met vriendelijke groet,
CSShunter