Skip to content

Instantly share code, notes, and snippets.

Created November 13, 2011 13:04
What would you like to do?
Force rendering a DOM element when Webkit is acting up
forceRerenderOnWebkit: -> += ';-webkit-transform:rotateZ(0deg)'
@el.parentNode.offsetHeight += ';-webkit-transform:none'
Copy link

gr2m commented Nov 15, 2011

I don't have a better solution, but your suggestion just fixed a bug I had in Opera. Thanks :-)

Copy link

gr2m commented Nov 15, 2011

I also found this plugin:

It confirms @KrofDrakula's suggestion for most cases but also has a "brutal" fallback where it changes CSS as you do in your suggestion, just using a 1ms timeout before it changes it back

Copy link

@gr2m: It would seem the "brutal" version here changing the padding seems a bit overkill; I use the following code for a rock solid repaint:

function forceRedraw(el) {
  var t = el.ownerDocument.createTextNode(' ');
  setTimeout(function() { el.removeChild(t); }, 0);

Copy link

helgri commented Nov 15, 2011

@gr2m damn, i just suggested a class named "repaint", not "redraw" ;)

but i still favor a solution which doesn't need to touch the dom at all

Copy link

nuragic commented Jun 10, 2014

Hi guys! Thanks to all for the suggestions... So, anyone know what is the most optimal way to force a reflow? Any jsPerf there? :)

Copy link

Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment