css - Chrome transform matrix iframe rendering glitch -


i have weird rendering glitch on webpage in google chrome. reproduced under mac chrome, , chrome under parrallels virtual machine in windows.

it's supposed simple draggable div. but, when drag around, looks this: http://imgur.com/vdy3tv2

the situation pretty unusual; it's container div css transform matrix, containing iframe, draggable div.

i created demo. drag div around: https://www.dropbox.com/s/cjq39w82mghuze2/bug.7z?dl=0

any idea causes this?

[edit]

i still have no idea. but: updating transform matrix of parent element (in case, using fit.js, , call watching.trigger()) forces redraw. so, might useful workaround helps people. :)

i found actual fix not stupid , half-working earlier attempt.

iframe {     -webkit-backface-visibility: hidden; /* chrome, safari, opera */     backface-visibility: hidden; } 

to clarify, iframe in have happening, apply above css.

no more glitches. stupid, have no idea why worked, tried random things, , worked. i'm guessing enables kind of different rendering flow avoids bug, whatever is.


Comments

Popular posts from this blog

java - Custom OutputStreamAppender not run: LOGBACK: No context given for <MYAPPENDER> -

java - UML - How would you draw a try catch in a sequence diagram? -

c++ - No viable overloaded operator for references a map -