Every time I click on a navigation button (Home, About, Contact, etc.) it loads refreshes the CSS background images. Is there a good way to cache the backgrounds so that they don’t have to keep loading every time?
Thanks,
Hi,
If you are talking about the first time that you hover over an element such as a nav then the best way is to use sprites so that the over state of the image is loaded along with the normal state and doesn’t need to be fetched when you need the hover state. This old example uses [URL=“http://www.pmob.co.uk/temp/images/navbgsprite.gif”]this image for the normal and hover states.
If you have different images for each state then you have to class every item and adjust the background-position to fit each item as required.
If you are experiencing some other issue then it may be that you have set images not to be cached in your browser settings.