zoukankan      html  css  js  c++  java
  • 关于事件mouseover ,mouseout ,mouseenter,mouseleave的区别

    最近在做网站遇到这样的问题:就是鼠标滑过的时候出现一个层,当鼠标滑到当前层的话mouseover和mouseout在低版本的浏览器会出现闪动的现象,解决这个现象的办法有许多,不过我觉得有一种是最简单的那就是把mouseover和mouseout换成对应的mouseenter和mouseleave。

    当鼠标指针位于元素上方时,会发生 mouseover 事件。

    该事件大多数时候会与 mouseout 事件一起使用。

    注释:与 mouseenter 事件不同,不论鼠标指针穿过被选元素或其子元素,都会触发 mouseover 事件。只有在鼠标指针穿过被选元素时,才会触发 mouseenter 事件。

    注释:与 mouseleave 事件不同,不论鼠标指针离开被选元素还是任何子元素,都会触发 mouseout 事件。只有在鼠标指针离开被选元素时,才会触发 mouseleave 事件。请看下面例子的演示。

    当鼠标指针穿过元素时,会发生 mouseenter 事件。该事件大多数时候会与mouseleave 事件一起使用。

    注意:mouseover ,mouseout当鼠标指针穿过被选元素子元素时,也会触发事件。这在绑定事件时,有时出现意想不到的Bug可能就是由 mouseover mouseout 事件引起的

    mouseover与mouseenter

    不论鼠标指针穿过被选元素或其子元素,都会触发 mouseover 事件。

    只有在鼠标指针穿过被选元素时,才会触发 mouseenter 事件。

    mouseout与mouseleave

    不论鼠标指针离开被选元素还是任何子元素,都会触发 mouseout 事件。

    只有在鼠标指针离开被选元素时,才会触发 mouseleave 事件。

  • 相关阅读:
    Windows7 64位 安装mysql
    汉诺塔(hanoi)
    大数据时代,Python是最好的语言!
    本地项目上传到github
    函数去抖(debounce)与 函数节流(throttle)
    vue项目出现的错误汇总
    vue-cli + webpack自动生成项目
    webpack和gulp
    前端开发利器之静态服务器
    vue开发知识点汇总
  • 原文地址:https://www.cnblogs.com/horanly/p/6644158.html
Copyright © 2011-2022 走看看