How can I open a div with javascript ? Mouseover & Mouseout style

I wanna put a link on my website and I want it to open div in onmouseover position and I want to close that are if the mouse out of the link. if anyone can help me with it ? if you can write function it would be awesome because It`ll open 12 different div.

This example I tried but it didnt work

<div id="mydiv" style="display: none">
  <h3>This is a test!<br> Can you see me?</h3> 
</div>
<p> 
  <a href="javascript:;" 
     onMouseOver="document.getElementById('mydiv').style.display = 'block'; }"    
     onMouseOut="document.getElementById('mydiv').style.display = 'none'; }">
     Toggle Div Visib开发者_运维问答ility
  </a>
</p>

You just needed to clean up the attributes a little - you have extra "}"s on the end.

<a href="javascript:;" 
     onMouseOver="document.getElementById('mydiv').style.display = 'block'"    
     onMouseOut="document.getElementById('mydiv').style.display = 'none'">
   Toggle Div Visibility
</a>

Alternatively, you can write a function as you suggested:

<a href="javascript:;" 
      onMouseOver="showElement('mydiv')" onMouseOut="hideElement('mydiv')">
   Toggle Div Visibility
</a>
<script type="text/javascript">
   function showElement(id) {
      document.getElementById(id).style.display = 'block';
   }
   function hideElement(id) {
      document.getElementById(id).style.display = 'none';
   }
</script>