SWEDISH WEB DESIGN BLOG

onMouseOver

Code:

<style type="text/css">
  #div1, #div2, #div3 {
    visibility: hidden;
  }
</style>
<script>
  function show(id) {
    document.getElementById(id).style.visibility = "visible";
  }
  function hide(id) {
    document.getElementById(id).style.visibility = "hidden";
  }
</script>

<br />
<div onmouseout="hide('div1')" onmouseover="show('div1')">
<div id="div1">
Div 1 Content</div>
</div>
<div onmouseout="hide('div2')" onmouseover="show('div2')">
<div id="div2">
Div 2 Content</div>
</div>
<div onmouseout="hide('div3')" onmouseover="show('div3')">
<div id="div3">
Div 3 Content</div>
</div>