เหตุการณ์ onmousemove

เหตุการณ์ DOM MouseEvent

คำนิยามและวิธีใช้

เหตุการณ์ onmousemove จะเกิดขึ้นเมื่อลูกศักดิ์ของเมาส์เคลื่อนตัวบนอิเล็ม .

ตัวอย่าง

ตัวอย่าง 1

เมื่อเคลื่อนตัวเมาส์ไปยัง <div> อิเล็ม เลือกจะปฏิบัติ JavaScript:

<div onmousemove="myFunction()">เคลื่อนตัวเมาส์เหนือฉัน</div>

ลองเดาเอง

ตัวอย่าง 2

ตัวอย่างนี้แสดงถึงความแตกต่างระหว่างเหตุการณ์ onmousemove, onmouseenter และ mouseover:

<div onmousemove="myMoveFunction()">
  <p id="demo">จะแสดงถึง onmousemove!</p>
</div>
<div onmouseenter="myEnterFunction()">
  <p id="demo2">จะแสดงถึง onmouseenter!</p>
</div>
<div onmouseover="myOverFunction()">
  <p id="demo3">จะแสดงถึง onmouseover!</p>
</div>

ลองเดาเอง

ตัวอย่าง 3

ตัวอย่างนี้แสดงถึงความแตกต่างระหว่างเหตุการณ์ onmousemove, onmouseleave และ onmouseout:

<div onmousemove="myMoveFunction()">
  <p id="demo">จะแสดงถึง onmousemove!</p>
</div>
<div onmouseleave="myLeaveFunction()">
  <p id="demo2">จะแสดงถึง onmouseleave!</p>
</div>
<div onmouseout="myOutFunction()">
  <p id="demo3">จะแสดงถึง onmouseout!</p>
</div>

ลองเดาเอง

คำสั่ง

ใน HTML

<element onmousemove="myScript">

ลองเดาเอง

ใน JavaScript

object.onmousemove = function(){myScript};

ลองเดาเอง

ใน JavaScript ใช้วิธี addEventListener()

object.addEventListener("mousemove", myScript);

ลองเดาเอง

หมายเหตุ:Internet Explorer 8 หรือตัวรุ่นเก่ากว่าไม่สนับสนุน วิธีการ addEventListener()。

รายละเอียดเทคนิค

การแบ่งสาย การสนับสนุน
สามารถยกเลิกได้ การสนับสนุน
ประเภทเหตุการณ์ MouseEvent
HTML แท็กที่สนับสนุน ทั้งหมด HTML อิเล็มนต์ ยกเว้น：<base>, <bdo>, <br>, <head>, <html>, <iframe>, <meta>, <param>, <script>, <style> และ <title>
DOM รุ่น: Level 2 Events

การสนับสนุนโดยเบราเซอร์

เหตุการณ์ Chrome IE Firefox Safari Opera
onmousemove การสนับสนุน การสนับสนุน การสนับสนุน การสนับสนุน การสนับสนุน
เหตุการณ์ DOM MouseEvent