`
xiaomogu
  • 浏览: 51771 次
  • 性别: Icon_minigender_2
  • 来自: 北京
文章分类
社区版块
存档分类
最新评论

冒泡问题,mouseover与mouseout

阅读更多
当mouseover(mouseout)

当为父容器绑定mouseout,鼠标从父容器移入其子元素的时候,也会触发mouseout,即:
进入子元素=移出父元素
两种解决方案:
1. http://www.cnblogs.com/yujian/archive/2011/12/13/2286302.html
2.http://bbs.blueidea.com/thread-2886332-1-2.html
var h=document.getElementById('hide');
h.onmouseout=function(e) {
var e = e || window.event, relatedTarget = e.toElement || e.relatedTarget;
while(relatedTarget && relatedTarget != this)
relatedTarget = relatedTarget.parentNode;
if(!relatedTarget)
alert("a");
}
  • 大小: 4.6 KB
分享到:
评论

相关推荐

    javascript中mouseover、mouseout使用详解

    本文详细探讨了如何在不同浏览器中使用mouseover和mouseout,以及如何处理事件冒泡中的兼容性问题。 首先,传统方法使用mouseover和mouseout事件处理鼠标指针在元素之间移动时,存在一个事件冒泡的问题。在子元素上...

    JS中mouseover和mouseout多次触发问题如何解决

    针对标题“JS中mouseover和mouseout多次触发问题如何解决”,主要内容探讨的是在JavaScript中使用jQuery库时,处理mouseover和mouseout事件由于事件冒泡导致的多次触发问题。当用户使用鼠标在页面元素间移动时,这些...

    javascript mouseover、mouseout停止事件冒泡的解决方案

    为了解决跨浏览器的`mouseover`和`mouseout`事件冒泡问题,开发者们采用了各种方法。例如,可以利用W3C标准中的`relatedTarget`属性来获取与事件相关的元素。`relatedTarget`属性在`mouseover`事件触发时指向鼠标...

    基于mouseout和mouseover等类似事件的冒泡问题解决方法

    在本文中,我们将深入探讨`mouseout`和`mouseover`事件以及它们与事件冒泡相关的常见问题,同时提供一种有效的解决方案。 `mouseout`和`mouseover`事件是两种常用的DOM(文档对象模型)事件,用于追踪用户鼠标在...

    经过绑定元素时会多次触发mouseover和mouseout事件

    然而,当这些事件被绑定到一个包含子元素的父元素上时,问题就出现了:当鼠标在子元素之间移动时,会连续触发 `mouseover` 和 `mouseout` 事件,这被称为事件冒泡或捕获。这种行为可能会导致不必要的处理,甚至在...

    实例讲解jquery中mouseleave和mouseout的区别

    为了解决这些问题,jQuery引入了mouseenter和mouseleave两个新的事件,它们与mouseout事件有很大区别,这一点非常重要,尤其是当我们希望精确控制鼠标事件行为时。 让我们来详细区分一下mouseleave和mouseout事件:...

    鼠标经过子元素触发mouseout,mouseover事件的解决方案

    这两个事件与`mouseover`和`mouseout`类似,但它们不会受子元素的影响。`mouseenter`仅在鼠标首次进入元素时触发,而`mouseleave`则在鼠标离开元素自身时触发,不会因为子元素而被反复触发。因此,使用`mouseenter`...

    javascript中mouseenter与mouseover的异同

    不知道大家在面试或者工作过程中有没有被 mouseover 和 mouseenter (对应的是 mouseout 和 mouseleave )事件所困扰。自己之前在面试的时候就有被问到诸如mouseover和mouseenter事件的异同之类的问题?当时没有答出来...

    JavaScript和JQuery的鼠标mouse事件冒泡处理

    简单的鼠标移动事件: 进入 代码如下: mouseenter:不冒泡 mouseover: 冒泡 不论鼠标指针穿过被选元素或其子元素,都会...给一个嵌套的层级绑定mouseout事件,会发现mouseout事件与想象的不一样 代码如下: <!DOC

    jquery图片冒泡提示效果.rar

    3. JavaScript文件:使用jQuery实现的脚本,包含图片冒泡提示的逻辑,可能包括事件监听器(如mouseover和mouseout)和动画效果。 4. 图片资源:用于演示效果的图片文件。 5. 可能还有其他支持文件,如字体或图标。 ...

    jquery图片冒泡提示效果

    该效果的核心在于利用jQuery的事件处理机制(如mouseover和mouseout)以及DOM操作方法来创建和控制提示框。首先,我们需要在HTML结构中为每张图片设置相应的数据属性,用来存储提示信息。例如: ```html 这是图片的...

    jquery常用方法及使用示例汇总

    mouseover事件大多数时候会与 mouseout 事件一起使用。 mouseover/mouserout事件由于冒泡机制,经常在不需要的时候不小心触发,从而导致一些脚本问题。 mouseenter()/mouseleave() mouseenter/mouseleave当且仅当...

    js下关于onmouseout、事件冒泡的问题经验小结.docx

    在上述代码中,当鼠标离开 `#div1` 时,会执行 `mouseout` 函数,并通过调用 `event.stopPropagation()` 来阻止事件继续向上冒泡。这样,只有在鼠标真正离开 `#div1` 时才会隐藏 `#div2`。 #### 四、总结 通过上述...

    jQuery鼠标经过动画出现冒泡对话框特效.zip

    利用jQuery的`mouseover`和`mouseout`事件,我们可以监听用户鼠标进入和离开触发元素的行为。同时,通过`animate`函数,我们可以实现平滑的动画效果: ```javascript $(document).ready(function() { $('.bubble-...

    原生js鼠标滑过跑到的按钮点击不到效果

    2. **鼠标滑过事件**:在JavaScript中,我们可以使用`mouseover`和`mouseout`事件来响应用户将鼠标光标移动到某个元素上方或离开该元素。`mouseover`触发时,光标进入元素或其子元素;`mouseout`则在光标离开元素...

    完美解决jQuery的hover事件在IE中不停闪动的问题

    通常,hover事件结合了mouseover和mouseout两个动作。然而,在旧版本的Internet Explorer(IE)浏览器中,使用hover事件时可能会遇到一个问题,即鼠标快速移动到触发下拉菜单时,菜单项会不停闪烁。这通常是由于...

Global site tag (gtag.js) - Google Analytics