Hi,

I'm getting trouble while implement the code of image rollovers. Please find the below code.

<a href="http://www.quackit.com/javascript/image_rollovers.cfm"
onMouseOver="/pix/smile.gif"
onMouseOut="/pix/nosmile.gif">
<img src="/pix/nosmile.gif"
	width="100"
	height="100"
	border="0"
	name="jack">
</a>

My actual intention was image rollovers by using the onMouseover event handler to swap the first image with the second image. The onMouseout event handler swaps it back to the original image. But it didn't works.
Can any one help me out please......!

Oh. Thanks for your great help. Now it's working. Jayavardhan, could you please tell me that how can we implement this one by using function?

Your welcome. Yeah, we can also done it by using function like below code.

// Pre load images for rollover
if (document.images) {
	smile = new Image
	nosmile = new Image

	smile.src = "/pix/smile.gif"
	nosmile.src = "/pix/nosmile.gif"
}


function swapImage(thisImage,newImage) {
	if (document.images) {
		document[thisImage].src = eval(newImage + ".src")
	}
}

//Calling the rollover function:

<a href="http://www.quackit.com/javascript/image_rollovers.cfm"
onMouseOver="swapImage('jack','smile')"
onMouseOut="swapImage('jack','nosmile')">
<img src="/pix/nosmile.gif"
	width="100"
	height="100"
	border="0"
	name="jack">
</a>
commented: It's superb yar!!! +1

It's awsome. You made clear evertything my doubt regaridng of this one. Thank's a lot.

<a href="location to go to here"
        onmouseover="document.NAME.src='changed-picture'"
        onmouseout ="document.NAME.src='orig-picture'">
  <img name=NAME src='orig-picture'>
  </a>

you need the ".src" as it is the property of the image object, that allows you to declare your image file.

...
onMouseOver="/pix/smile.gif"
onMouseOut="/pix/nosmile.gif">
<img src="/pix/nosmile.gif"
	width="100"
	height="100"
	border="0"
	name="jack">
...

codes highlighted in red are your issue.

commented: Well spotted +14

@vee_liang well spotted.

PS: So just you know Jayavardhan and Rameshkeerthi are the same user. With fake account he create lame question and then he reply. Return back as original poster and he pretend solution is great and that he is grateful and pleased with solution. This also include attempt to give his main account reputation. So often we find lousy replies which minors his reputation stats

PS2: He just got ban as I see he was just copy-pasting stuff. Stupid of him leave all these URLs in Java Script

Be a part of the DaniWeb community

We're a friendly, industry-focused community of developers, IT pros, digital marketers, and technology enthusiasts meeting, networking, learning, and sharing knowledge.