Gentlemen, I have a website with a retouch album and there, after hovering on BEFORE, the original photo is replaced with a photo before retouching (I’ll call it BEFORE), this is done using js, but the problem is that drawing a BEFORE photo in OPER (and only in it) happens to flicker. The preloading of a BEFORE photo is naturally imeee. It is clear that the opera somehow draws images, but are there any solutions to this flickering problem when changing photos?

    2 answers 2

    There is an option - display a photo of AFTER above BEFORE. Then at the touch of a button, the AFTER layer disappears and, in theory, the BEFORE layer is displayed without flickering.

    Posted on 08/08/11
    The advantage of this approach is the ability to enable smooth image changes via javascript. If you just need to change the image, then read below about css sprites.
    P.S. Well, or read about preloading images, but this is a bit outdated way.

    • That is, in two layers, and then invizibl top layer? - Alexander Zheleznovsky
    • Exactly. - ling
    • The idea is good, but the memory consumption will grow ... - Ivlev Denis

    Use sprites: here is an example .

    • The advantage is no js, ​​pure css. In general, sprites are a good tone in layout :) - metazet