onmousemove 事件

onmousemove 事件的意思是當滑鼠游標移動的時候，屬於 JavaScript event 的一種，用來監聽網友的滑鼠游標，是否在特定的區域內移動，如果有產生這樣的行為模式，就觸發特定的 JavaScript function 去執行特定的工作，由於 onmousemove 的特性，剛開始學習的設計師常常搞混他與 onmouseover 的差別，這裡稍微說明一下兩者個差異，onmouseover 是當滑鼠移入被監聽區域才會啟動，且只會觸發一次 function，而本篇主角 onmousemove 只要在被監聽區域內移動滑鼠都會觸發 function，所有主流瀏覽器都支援 onmousemove 事件。

onmousemove 事件基本語法

onmousemove = " 要觸發的 JavaScript function "

語法中＂要觸發的 JavaScript function＂是必要項目，設計師可以將 onmousemove 放在各種不同的網頁元素中，監聽網友的行為模式，但最重要的還是當監聽到滑鼠在區域內移動，就要觸發 function 去執行特定的工作內容。這邊稍微提醒一下，onmousemove 是只要滑鼠有移動都會觸發 function，持續的觸發將對整體效能有所影響，採用此事件前需要比較謹慎。

onmousemove 事件範例

<div id="TestBox" onmousemove="alert('滑鼠移動')" style="padding:5px;background-color:#FFE5B5;">
滑鼠游標移經此處測試
</div>

範例輸出結果

滑鼠游標移經此處測試

無論是滑鼠移入橘色的測試區、在測試區內移動或者是移出測試區，都會觸發 alert 將字串透過對話視窗顯示，僅管滑鼠剛移入測試區的時候效果與 onmouseover 一樣，移出時測試區效果與 onmouseout 一樣，但在測試區內移動的監視功能，僅有 onmousemove 做得到。

延伸閱讀