Click to See Complete Forum and Search --> : On mouse over change image
ovisopa
11-30-2002, 03:11 PM
Hello ppl, I'm new to this forum and I'm new to javascript and maibe you can help me.
What I want is when I moce the mouse over a link (text link) to change an image like this:
---------------
| image here|
| |
----------------
Menu :
Link1
Link2
Link3
Link4
... so when I move the mouse over link1 I want img1.gif to be in "image here" , when I move the mouse over link2 img2.gif to be in "image here" ...
I hope you understand what I want and maibe you can help me.
10x and see ya
<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN">
<html><head>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8">
<script type="text/javascript">
img1 = new Image();
img1.src = "file.ext";
img2 = new Image();
img2.src = "file.ext";
img3 = new Image();
img3.src = "file.ext";
img4 = new Image();
img4.src = "file.ext";
function change(num){
document.images[linkpic].src = eval("img" + num);
}
</script>
</head>
<body>
<img src="file.ext" name="linkpic">
<br><br>
<a href="page.ext" onclick="change('1')"><br>
<a href="page.ext" onclick="change('2')"><br>
<a href="page.ext" onclick="change('3')"><br>
<a href="page.ext" onclick="change('4')"><br>
</body>
</html>
gil davis
11-30-2002, 04:20 PM
You don't need the eval, and you need some quotes:
document.images[linkpic].src = eval("img" + num);
Should be:
document.images["linkpic"].src = "img" + num + ".ext";
(whatever .ext means)
He asked for mouseover, not click:
<a href="page.ext" onmouseover="change('1')">
You probably want a mouseout as well.
ovisopa
12-01-2002, 03:52 AM
Hello ppl,
you can see the site I made here :
www.nokitel.sibiul.ro , and in the left side I have the menu, above the menu I have a circle, there is the pic I wanna change when I move the mouse over a link, and I'm gonna need an mouseout to.
I'm gonna try the script you gived me and I'm gonna tell if it's working and if it's not maibe you can help me again:)
10x anyway
see ya all
E-Solutions
12-02-2002, 08:18 AM
If you go to http://www.dynamicdrive.com/dynamicindex5/linkinfo.htm they have the script your looking fo there. if you have html skills you can customize it with out a problem.
Alex