Is there a way to encapsulate several DOM manipulating commands in a transaction so that the content would not “flicker about”? Something like this:
window.stopDrawing(); // start transaction
$("#news").append("<div>a new news item</div>");
// ... do something more
$("#news").css("top", "-150px");
window.startDrawing(); // stop transaction
Everytime you must update a large set of elements just set up a function including all the operations, call mozRequestAnimationFrame(or webkitRequestAnimationFrame), only after your function is finished executing completely it will draw your changes to the screen.
More at:
https://developer.mozilla.org/en/DOM/window.mozRequestAnimationFrame