0%

mouse 滑過事件差異

整理一些 mouse 滑過事件差異

事件解釋

  • mouseover : 當滑鼠移動到被選元素和被選元素的子元素時,mouseover 事件就會被觸發。
    mouseover MDN 文件

  • mousemove : 當滑鼠移動到被選元素內後,mousemove 事件被觸發。
    mousemove MDN 文件

  • mouseenter: 當滑鼠移動到元素上時就會觸發 mouseenter 事件,類似 mouseover,它們兩者之間的差別是 mouseenter 不會冒泡(bubble),也就是說當游標從它的子層物理空間移到它的物理空間上時不會觸發
    mouseenter MDN 文件

相關討論文章

  • jQuerymouseover()hover() 差異可參考 stackoverflow 討論
    • mouseover():將事件綁定在「mouseoverJavaScript事件,或在元素上觸發該事件。
    • hover():將一個或兩個處理程序綁定到匹配的元素,以在滑鼠游標進入和離開元素時執行。
  • CSS hoverJavaScript mouseover 討論可參考 stackoverflow 討論
    • 討論中有人提到 CSS 比較好維護,也有提到 CSS hoverIE6 雖可支援,但因為後來的 IE7CSS2 的支持程度約為50% 所以不支援 div:hover