Preload images trick
You probably had situation when you made beautiful menu with large icons different for each menu point. Now you want to have shinny effect when user go rollover your menu point but he will need to wait until this “on hover” image loads. Often he don’t wait and he don’t see the effect. So how to make this work without waiting to load this extra images? Here’s the trick.
List all your hover images anywhere into your html code and give them class name “hidden”. It should look like this:
Now add this class to your CSS and make all this images invisible. It should look like this:
.hidden {
display: none;
}
This simple trick make this images invisible but they are going to be loaded and placed in users browser cache. So when user goes “mouse over” this images will be already loaded and displayed without any delay.
