onmouseover 事件

定义和用法

onmouseover 事件会在鼠标指针移动到指定的对象上时发生。

语法

  1. onmouseover="SomeJavaScriptCode"
参数 描述
SomeJavaScriptCode 必需。规定该事件发生时执行的 JavaScript。

支持该事件的 HTML 标签：

  1. <a>, <address>, <area>, <b>, <bdo>, <big>, <blockquote>, <body>, <button>, 
  2. <caption>, <cite>, <code>, <dd>, <dfn>, <div>, <dl>, <dt>, <em>, <fieldset>, 
  3. <form>, <h1> to <h6>, <hr>, <i>, <img>, <input>, <kbd>, <label>, <legend>, 
  4. <li>, <map>, <ol>, <p>, <pre>, <samp>, <select>, <small>, <span>, <strong>, 
  5. <sub>, <sup>, <table>, <tbody>, <td>, <textarea>, <tfoot>, <th>, <thead>, 
  6. <tr>, <tt>, <ul>, <var>

支持该事件的 JavaScript 对象：

  1. layer, link

实例 1

在下面的例子中，我们将在用户把鼠标指针移动到图像上时显示一个对话框：

  1. <img src="/i/eg_mouse2.jpg" alt="mouse"
  2. onmouseover="alert('您的鼠标在图片上！')" />

输出：(请把鼠标移动图片上):

Visit!

实例 2

下面的例子中，我们将在网页上添加一个用作连接按钮的图像，然后我们会添加 onMouseOver 和 onMouseOut 事件，这样就可以在运行两个 JavaScript 函数来切换两幅图像：

  1. <html>
  2. <head>
  3. <script type="text/javascript">
  4. function mouseOver()
  5. {
  6. document.getElementById('b1').src ="/i/eg_mouse.jpg"
  7. }
  8. function mouseOut()
  9. {
  10. document.getElementById('b1').src ="/i/eg_mouse2.jpg"
  11. }
  12. </script>
  13. </head>
  14.  
  15. <body>
  16. <a href="http://www.baidu.com" 
  17. onmouseover="mouseOver()" onmouseout="mouseOut()">
  18. <img alt="Visit baidu!" src="/i/eg_mouse2.jpg" id="b1" />
  19. </a>
  20. </body>
  21. </html>

输出：

Visit!