0

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......!

4
Contributors
5
Replies
6
Views
7 Years
Discussion Span
Last Post by peter_budo
1

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?

1

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>
Votes + Comments
It's superb yar!!!
0

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

1
<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.

Votes + Comments
Well spotted
0

@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

Edited by peter_budo: n/a

This question has already been answered. Start a new discussion instead.
Have something to contribute to this discussion? Please be thoughtful, detailed and courteous, and be sure to adhere to our posting rules.