Last Updated: October 04, 2020
·
101.7K
· jaysoo

Force redraw on an element (jQuery)

This snippet can help in cases where the browser doesn't redraw an updated element properly.

$.fn.redraw = function(){
  $(this).each(function(){
    var redraw = this.offsetHeight;
  });
};

You'd then call the method like this:

$('.theElement').redraw();

More info can be found here on why it works: http://apmblog.compuware.com/2009/12/12/understanding-internet-explorer-rendering-behaviour/

Related protips:

fatal: refusing to merge unrelated histories

2 Responses
Add your response

Return the original jQuery collection to allow chaining. These comments don't allow code formatting, but:
$.fn.redraw = function() {
$(this).each(function() {
var redraw = this.offsetHeight;
});
return $(this);
};

over 1 year ago ·

Actually adding a return in front of $(this).each should do the trick for chaining.
$.fn.redraw = function(){
return $(this).each(function(){
var redraw = this.offsetHeight;
});
};

over 1 year ago ·