I find it hard to explain why the following code is slower in IE9 than IE8!
Here are some test codes that work smoothly after about half a second in the latest version of FF / Chrome / Safari on OS X, WinXP and Win7 plus IE7 and 8 on WinXP (for simplicity, I removed the setting that makes it work in IE6).
For some reason I cannot explain, this is terrible in IE9, slow and clumsy. Reducing the time for setTimeout makes it a little faster, but no less jerky.
I tried to remove and compare gasoline with the number of possible values (for example, Math.min ... everything is unchanged.
I'm at a dead end ... can someone point me in the right direction? ... preferably one that doesn't require a sniff from the browser?
Here's the test code ...
<div id = 'panel' class='noShow' style='background-color: #aaa;'>
<div id = 'wrapper' class='slideWrapper'>
<p>xxxxxxxxxxx</p><p>xxxxxxxxxxx</p><p>xxxxxxxxxxx</p><p>xxxxxxxxxxx</p><p>xxxxxxxxxxx</p><p>xxxxxxxxxxx</p><p>xxxxxxxxxxx</p><p>xxxxxxxxxxx</p><p>xxxxxxxxxxx</p><p>xxxxxxxxxxx</p>
</div>
</div>
<script type = 'text/javaScript'>
var e = document.getElementById('panel');
var w = document.getElementById('wrapper');
w.style.overflow = 'hidden';
w.style.height = '1px';
var sh = w.scrollHeight;
show();
function show()
{
setTimeout(function()
{
w.style.height = Math.min(sh, (w.offsetHeight + Math.ceil(sh/15))) + 'px';
if(
(w.offsetHeight < sh)
)
{
show(e);
}
else
{
w.style.height = 'auto';
}
}, 20);
}
</script>
source
share