Dear all,
I am a very novice javascriper and have cobled this together from
various places. I didnt expect it to work but hopefully will give you
an idea of what i want to achive.
I need 5 links that when you mouseover it, it displays the corisponding
div and separate image. When you mouse out it goes back to the defult.
first link.
I hope you get the idea.
Please help as i will never mange this on my own
Many thanks
Alex Kemsley
<html>
<head>
<title></title>
<script type="text/javascript">
function doStuff(el) {
document.all.tubimage.src=el+".jpg";
document.getElementById.el.style.display="block";
el.onmouseout=function() {
document.all.tubimage.src="monaco.jpg";
document.getElementById.el.style.display="none";
}
}
</script>
</head>
<body>
<p>
<img src="monaco.jpg" alt="" id="tubimage" /></p>
<a onmouseover="doStuff(monaco)">Monaco</a><br />
<a onmouseover="doStuff(sttropez)">St Tropez</a<br />
<a onmouseover="doStuff(barclona)"Barcelona</a><br />
<a onmouseover="doStuff(milan)">Milan</a><br />
<a onmouseover="doStuff(prague)">Prague</a><br />
</p>
<div id="monaco" style="display:none">
monaco text
</div>
<div id="sttropez" style="display:none">
sttropez text
</div>
<div id="barcelona" style="display:none">
barclona text
</div>
<div id="milan" style="display:none">
milan text
</div>
<div id="prague" style="display:none">
prague text
</div>
</body>
</html>
