Are DOM style calls limited by frequency?
I'm trying to resize an html element (flash object) but it doesn't seem to respond more than once per second?
Is this a limitation imposed by browsers (both IE7 and FF3 do this)? Or should I be attempting to resize in a different/more efficient way?
function setHeightNow(height) {
if (document.getElementById) {
if (height > 0) {
var scaleItem = document.getElementById('applic开发者_开发百科ation');
scaleItem.style.height = height + 'px';
}
}
}
If you are calling this function in a loop, as bobince mentioned in his/her comment, you should change it to a series of setTimeout
calls (or setInterval
) to give control back to the browser.
Something like this-
var i = INITIAL_VALUE;
(function() {
setHeightNow(foo);
if (i < FINAL_VALUE) {
i++;
setTimeout(arguments.callee, 0); //you can play around with the timeout.
}
})();
Also
- The
documents.getElementById
check is kind of useless because all browsers support it. - It would be wise to somehow take the
document.getElementById
call outside this repeating function if possible.
It's certainly not a defined limitation; we run an animation loop that is triggered 30 times/sec. (Using a 33ms timeout.) Mostly we move backgrounds around (animations) or adjust opacity (fade in/out) but sometimes we also re-size elements.
However, all of those elements are absolutely positioned, or in a fixed container, so it doesn't trigger a re-layout by the browser. I suspect your problem is simply the cost of performing that re-layout, most of which would be down to the flash object itself.
精彩评论