[Wine] WinHQ.org website - CSS preloading

Arite
Tue, 28 Jul 2009 17:12:20 -0000

Hi,

I wasn't sure where to write this so thought I'd just put it in the
forum. The WineHQ.org website is great, just I think pre-loading the hover
images for the main menu section would make the site even better as it would no
longer mean the hover images would need to be loaded when the mouse is hovered
over them.

I found a solution here:
http://www.maratz.com/blog/archives/2005/06/22/preload-hover-images-in-css/

So, currently the CSS is e.g. as follows:

Code:
ul.winehq_menu li.info             { background-image:
url('images/main_info.png'); background-repeat: no-repeat }
ul.winehq_menu li.info:hover       { background-image:
url('images/main_info_s.png'); background-repeat: no-repeat }



And instead doing something like:

Code:
ul.winehq_menu li.info             { background-image:
url('images/main_info_s.png'); background-repeat: no-repeat }
ul.winehq_menu li.info:link        { background-image:
url('images/main_info.png'); background-repeat: no-repeat }
ul.winehq_menu li.info:hover       { background-image:
url('images/main_info_s.png'); background-repeat: no-repeat }


Should hepofully preload the images (haven't tested it out though).

Cheers, Arite.