Sly re-render thumbnails causing flickering when mouseover

MrUkyoDuong commented 8 years ago

When thumbnails are off screen, and brought back into view by the slider bar and then moused over, the thumbnails are re-rendered noticeably.

Scenario:

thumbnail is a parent of a logo image and a text node, i.e., logo and text are rendered on top of the thumbnail with z-index as positive index, 10.
thumbnail has no z-index but opacity=0.6
in CSS I define that when a thumbnail is mouseOver it has a opacity = 1
I have 15 fixed sized thumbnails images and screen can only display 10.

Problem:
I pull the slider all the way to the right to view 5 more images. When mouseOver the thumbnail, the thumbnail re-rerenders, then the logo, and then the text. The re-rendering is very noticeable.

sergey-dev commented 8 years ago

it may be you can post some JSFiddle to illustrate? I have the feeling the glitch is not connected to Sly... but let's see.

MrUkyoDuong commented 8 years ago

Not a problem anymore. I use translatez(0) or translate3d(0,0,0) in the CSS for those images. Hardware acceleration (GPU) takes care of the repaint and no flicker or flash is seen.

darsain / sly

Sly re-render thumbnails causing flickering when mouseover #261