I have a submit button that changes when the user hovers his mouse over it. Right now the image is taking a while to load and you get a half second where there is white screen instead of the other button. Is there anyway to improve this using just CSS and HTML or do I need to do some JS work?
+3
A:
Use a sprite image, and then toggle background position on hover. That ensures that the image being displayed on hover has already been downloaded.
Dustin Laine
2010-03-28 02:26:42
although i have noticed a lapse in sprites too.
pixeltocode
2010-03-28 02:29:58
Hmmm. I have never seen that behavior.
Dustin Laine
2010-03-28 02:31:56
A:
And load the css sprites when DOM is ready, this can sort of "preload" the image before user hovers on the submit button :)
Michael Mao
2010-03-28 02:29:15
@pixeltocode : justification : demo link provided, and my advice on "preloading" the css sprites when DOM is ready to save loading time and improve usability.
Michael Mao
2010-03-28 02:56:58
@pixeltochode : all right, that's the story : I spent 2 mins searching through my bookmarks and tested the css sprite link before submit this answer,so that was why it was 2 minutes later than the above one. I mean no trying to gain a tick or anything, just feel this might be helpful to @Splashlin. If you feel this is a duplicate answer, that's fine. Can we end this questioning plz?
Michael Mao
2010-03-28 06:15:22