MrMcCoy;1251533 wrote:As for the code that looks about right, thanks for your help. Would it be better to put the onMouseover on the actual anchors or is there any way I can have the JavaScript loop through all the ID's of the anchors?
It's just that I have over 100 anchors and I'm thinking it might save some time.
Also a bit more background on the project. It's basically a map with markers, when someone clicks on one of the markers I want some text to come up about that specific location. The text appears in a div to the left of the map. I can upload a picture if it helps.
Thanks again.
McCoy
Pictures are always helpful. Worse than actual code, but better than non-descriptive words! :eek:
Here is an event assignment for each of the 100 anchors example. 
I added the colors just for a diversion. 
Remove them if desired as they are not necessary to the request. 
<!DOCTYPE HTML>
<html>
<head>
<title> Untitled </title>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8">
<style type="text/css">
#messageDisplay { background-Color:yellow; height:50px; width:200px; }
</style>
<script type="text/javascript">
var anchorMessages = [ '',
'Message 1',
'Message 2',
'Message 3',
'Message 4',
'Message 5',
'Message 6',
'Message 7',
'Message 8',
'Message 9'
];
var roygbiv = ['white','red','orange','yellow','green','blue','lightblue','pink','lime','cyan'];
function changeMessage(msgNo) {
document.getElementById('messageDisplay').innerHTML = anchorMessages[msgNo];
document.getElementById('messageDisplay').style.backgroundColor = roygbiv[msgNo];
}
</script>
</head>
<body>
<div id="messageDisplay"></div>
<div id="anchors">
<a href="#">Anchor 1</a> <a href="#">Anchor 2</a> <a href="#">Anchor 3</a><p>
<a href="#">Anchor 4</a> <a href="#">Anchor 5</a> <a href="#">Anchor 6</a><p>
<a href="#">Anchor 7</a> <a href="#">Anchor 8</a> <a href="#">Anchor 9</a><p>
</div>
<script type="text/javascript">
window.onload = function() {
var sel = document.getElementById('anchors').getElementsByTagName('a');
for (var i=0; i<sel.length; i++) {
sel[i].value = (i+1).toString();
sel[i].onmouseover = function() { changeMessage(this.value); }
sel[i].onmouseout = function() { changeMessage(0); } // comment out to make message stick
}
}
</script>
</body>
</html>
