Tek-Tips is the largest IT community on the Internet today!

Members share and learn making Tek-Tips Forums the best source of peer-reviewed technical information on the Internet!

  • Congratulations Chriss Miller on being selected by the Tek-Tips community for having the most helpful posts in the forums last week. Way to Go!

show a Randum image when roll over

Status
Not open for further replies.

chestnut2007

Programmer
Joined
Feb 4, 2007
Messages
2
Location
JP
I just tried to make randum images which shows one of them when I rolled over the image.
I just set randum array and variable to output the images when I rolled over.
These scripting below is my scripting. But it does not work...
Could you help me??
Thanks

<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN"
"<html>
<head>
<script language="JavaScript"><!--

var imglist = new Array(
"flowerA.gif",
"flowerB.gif",
"flowerC.gif",
"flowerD.gif" );
var selectnum = Math.floor((Math.random() * 100)) % imglist.length;
var output = "<img src=" + imglist[selectnum] + ">";


myImgOut = new Image(); // the mouse roll out
myImgOut.src = "flowerA.gif"; // loading image
myImgOver = new Image(); // the mouse over image
myImgOver.src = "output"; // I just tried to put output variable name.but I think it is not correct...


function myMouseOut(){ // mouse roll out
myFormImg.src = myImgOut.src; //show the image
}

function myMouseOver(){ // mouse roll over
myFormImg.src = myImgOver.src;// show the image
}
// --></script>

<title>flower</title>

</head>

<body>

<div align="center">
<a href="" onMouseOver="myMouseOver()" onMouseOut="myMouseOut()">
<img border="0" name="img" src="flowerA.gif"></a></div>
</body>

</html>
 
This:
myFormImg

is not the name of your image, but your functions are swapping images with that. You should use document.images[imagenamehere].src

And DON'T name your img img (or any other page element the same as a page tag> or you're going to be looking for trouble.

Lee
 
[ideological difference of opinion]
You could give your image an ID and use document.getElementByID() to reference it.
[/ideological difference of opinion]

Never be afraid to share your dreams with the world.
There's nothing the world loves more than the taste of really sweet dreams.

Enable Apps
 
That would work as well.

Spending a little more time with this script with MANY errors, I'd rewrite part of it to this:
Code:
var selectnum = Math.floor(Math.random() * imglist.length);   
   
myImgOut  = new Image();
myImgOut.src  = "flowerA.gif";
myImgOver = new Image();
myImgOver.src = imglist[selectnum];

Other than that, the original post is about so many basic things how HTML and Javascript work, I wonder if it's some sort of class assignment.

Lee
 
Dear trollacious:
Thank you for your quick reply! Actually I am beginer in Javascript. It is just for my lerning. I know Action scripting Flash but I am not sure about Javascript.
So I just start to leran.

Anyway I am very appreciate it.

var selectnum = Math.floor(Math.random() * imglist.length);
I think it is better than my original one.
I am going to try to refine by taking your advice.

Thank you so much!
chestnut(^-^)

Dear dwarfthrower

Thank you for your quick reply! Actually I made it to use some tutorial and modified it.
So that is why I made mistake the image name...
But Thank you for your advice!!
chestnut(^-^)
 
Status
Not open for further replies.

Part and Inventory Search

Sponsor

Back
Top