0

I have a menu that consist in five divs with a background image each. On mouseover, the background changes. The problem with this is that is loading the second image on the first mouseover... How can I do to load all the images at the same time? How can I get the resources first, and then use them? I'm using wordpress and mootools right now, so any answer for those specific frameworks would be nice.

limoragni
  • 2,716
  • 2
  • 32
  • 50
  • 1
    Preload them using javascript... http://stackoverflow.com/questions/3138561/preload-images-using-jquery – XCS Jan 28 '12 at 20:05
  • @Cristy: It can be done without JavaScript, and it should be done without JavaScript. – Madara's Ghost Jan 28 '12 at 20:19
  • @Truth Sprites should be used for small images such as buttons, icons, etc... It is not recommended to use sprites for large images such as backgrounds. (now, he hasn't specified the sizes of the divs) – XCS Jan 30 '12 at 12:56
  • @Cristy: 1. There's no size limit. Sprites work well for both small and large images. 2. He did say it was a menu, and he needs the image to change. Hence, sprites is the way to go. – Madara's Ghost Jan 30 '12 at 15:11

1 Answers1

1

Use CSS Sprites

Madara's Ghost
  • 172,118
  • 50
  • 264
  • 308