Can anyone tell me the best way to validate a mouseover image. "onload" doesn't validate. When I tried using the a:hover {background-image: url(....);} , it takes too long to load. Any advice?

Put this in the head of your page:

<script language="Javascript" type="text/javascript">
<!-- hide script from old browsers
/*Simple Rollover script*/
	if (document.images) {
	orgimg = new Image
	switchimg = new Image
	orgimg.src = "images/originalimage.jpg"
	switchimg.src = "images/rolloverimage.jpg"
	}
	else {
	orgimg = ""
	switchimg = ""
	document.roll = ""
	}
// end hiding script from old browsers -->
</script>

Then you call the rollover in the link or image like so:

<a href="*" onmouseover="document.roll.src=switchimg.src" onmouseout="document.roll.src=orgimg.src"></a>

That will work and validate; I use that particular rollover on one of my sites.
tim

I just did this for a page im making accualling

<a href="link of image here" onmouseover="nameofsourcefilehere.src='url to image for mouse over'" onmouseout="nameofsourcefilehere.src='url to image after your mouse is scrolls over'"><img src="url to image before mouse scrolls" name="nameofsourcefilehere" border="0" /></a>

for an example of this code go http://eveotto.com/test.html

MIND THE MESS OF CODING OR EVEN THE PAGE

I TORE THE WHOLE SITE DOWN AND STARTING OVER -_-

Simple yet valid. enjoy

I always make rollovers with sprites, which prevents the "flicker" effect you are experiencing as the :hover image loads. http://www.alistapart.com/articles/sprites

You should also wrap the scripting inside CDATA so that the validator will ignore it.