This snippet enables preloading of images that may be used in rollovers, or in other cases where an image is shown “on demand”.

There are two versions: the first does not require jQuery, the second does.

Use in conjunction with Smart Buttons strongly recommended. This snippet will minimize the risk of the annoying “flicker” effect that can occur when a visitor moves the mouse over the button for the first time.

Download the non jQuery version here. Download the jQuery verision here.

The jQuery version is a RW snippet made from code provided by Matt Farina in his post Preloading Images with jQuery.

To use:

Unzip the file. Double-click the snippet file to install, close RW.

Open RW, open your project.

In the page you wish to use the Picture Preloader, open the Page Inspector.

Go to the “Header” tab, within that open the “Header” tab.

Drag the snippet into this field.

The snippet has three example image files. You may add/remove them as necessary.

As another example, see the code used on my “Code of Interest” page, that loads the button images:




And the jQuery version (remember that a version of jQuery must be included
before this code):



If you find it useful, please consider making a small donation

I'd really appreciate it!