onmouseover 事件用來判斷網友是否將滑鼠移至特定對象或網頁元素上,假設發生滑鼠移至安插 onmouseover 事件的元素上,將會觸發特定的 JavaScript 函式開始執行特定的工作,例如當滑鼠移至一張圖片上,自動顯示對話視窗介紹圖片,或者是滑鼠移到某張網頁縮圖上,就自動顯示原始大圖,都是常見到的 onmouseover 事件應用方式,所有主流的瀏覽器都支援 onmouseover 事件。
onmouseover 事件語法onmouseover = " 即將要觸發的 JavaScript function "
語法中的"即將要觸發的 JavaScript function"是必須項目,onmouseover 的功能僅為監聽到網友發生滑鼠移經元素的情況,真正要執行任務的還是要透過 JavaScript 的各種功能或 function,以下準備一個非常簡單的參考範例。
onmouseover 事件範例<div onmouseover="alert('看到測試結果囉!')" style="padding:5px;background-color:#FFE5B5;">
滑鼠游標移經此處測試
</div>
以上範例輸出
這個範例的效果是當滑鼠移經
DIV 區塊(粉橘色區塊)上的任何一個地方,都會跳出一個對話視窗顯示"看到測試結果囉!"這樣的結果,比較重要的是『onmouseover="alert('看到測試結果囉!')"』這個部分,onmouseover 注意到滑鼠移經
DIV 區塊就立即透過 alert 將文字顯示出來,範例中的
padding 是內距、
background-color 則是
DIV 區塊的背景顏色。
延伸閱讀