`
joshuaton
  • 浏览: 27757 次
  • 性别: Icon_minigender_1
  • 来自: 北京
社区版块
存档分类
最新评论

ie7元素position设为absolute其子元素mouseover,mouseout等鼠标事件失效

阅读更多

在作鼠标经过时的一些特效(combox,suggest,menutffu)时,使用用mouseover,mouseout,mousermove事 件时。如果某个html元素的position值为absolute时,ie7下,如果鼠标经过其子元素的空白处,上述事件将无效;如果经过文字时,事件 触发正常。但ie6下都正常。
注:无论事件如何定义结果一样(html标签,dom的属性,attachEvent)
解决办法:
一:为该元素设置background属性,值不能为transparent。
二:设置该元素的子元素的background属性,值不能为transparent。
如: <style type="text/css">
    #main{
        background-color:white;/*这个很重要,没有这个定义,IE7下不正常*/
        position:absolute;
        width:200px;
    }
    #main .hover{
        background:blue;
        color:white;
       
    }
</style>
<div id="main">
    <div>sddffd</div>
    <div >sddffd</div>
    <div>sddffd</div>
    <div>sddffd</div>
    <div>sddffd</div>
    <div>sddffd</div>
</div>
<script type="text/javascript">
<!--
var t={}
    var m=document.getElementById("main");
    m.onmousemove=function () {
        o=event.srcElement;
        if(o!=this){
            t.className="";
            o.className="hover";
            t=o;
        }
    }
//-->
</script>

 

来源:http://hi.baidu.com/trarck/blog/item/0959da39711f6af43a87ced5.html

分享到:
评论

相关推荐

    javascript中mouseover、mouseout使用详解

    在JavaScript中,mouseover和mouseout事件是常用的事件,它们分别在鼠标指针进入和离开指定元素时触发。在事件处理中,区分鼠标指针是从子元素移入还是从父元素移出对于正确地触发相应的事件非常关键。本文详细探讨...

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

    `mouseover`事件会在鼠标指针进入元素或者其子元素时触发,而`mouseout`事件则在鼠标离开元素或其子元素时触发。这就意味着,当鼠标从父元素移向子元素时,会先触发父元素的`mouseout`,接着触发子元素的`mouseover`...

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

    相反地,mouseout事件会在鼠标指针离开被选元素或其任何子元素时被触发。这种特性意味着即使鼠标并没有真正离开父元素,当鼠标移动到子元素上时,父元素的mouseout事件也会被触发。 3. mouseenter和mouseleave事件...

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

    在JavaScript和jQuery中,`mouseover` 和 `mouseout` 事件是常见的用于响应鼠标进入和离开元素的事件。然而,它们在处理嵌套元素时可能会引发一些问题,导致事件被不期望地多次触发。这是因为当鼠标从一个子元素移动...

    关于事件mouseover ,mouseout ,mouseenter,mouseleave的区别

    最近在做的在线考试和课程商城都遇到这样的问题:就是鼠标滑过的时候...注释:与 mouseenter 事件不同,不论鼠标指针穿过被选元素或其子元素,都会触发 mouseover 事件。只有在鼠标指针穿过被选元素时,才会触发 mouse

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

    `mouseover`事件会在鼠标指针进入一个元素时触发,而`mouseout`事件会在鼠标指针离开一个元素时触发。这两个事件的特殊性在于,它们会频繁触发,并且在触发时,浏览器会同时检查目标元素和相关目标元素(即鼠标进入...

    为非IE浏览器添加mouseenter,mouseleave事件

    `mouseover`和`mouseout`在鼠标进入或离开元素及其子元素时都会触发,而`mouseenter`和`mouseleave`只在鼠标进入或离开元素本身时触发,不包括其子元素。这在处理复杂的布局或多层次的交互时特别有用,因为它可以...

    svg小例子(主要是鼠标事件)

    SVG元素同样支持HTML中的大部分鼠标事件,如`click`(点击)、`mouseover`(鼠标移入)、`mouseout`(鼠标移出)、`mousedown`(鼠标按键按下)和`mouseup`(鼠标按键释放)等。 1. `click`事件:当用户对SVG元素...

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

    `mouseover`事件在鼠标指针进入元素或其子元素时触发,而`mouseout`事件则在鼠标离开元素或其子元素时触发。然而,这两个事件的一个关键问题是它们会遵循事件冒泡机制。 事件冒泡是指事件从最深的节点开始,然后...

    JavaScript鼠标常用事件列表

    2. `mouseout`:当鼠标离开元素或其子元素时触发。 3. `mouseover`:当鼠标进入元素或其子元素时触发。 4. `click`:单击鼠标按钮时触发,通常用于执行简单的操作。 5. `dblclick`:双击鼠标按钮时触发,常用于打开...

    jQuery中hover与mouseover和mouseout的区别分析

    举个例子,当一个父元素内嵌套有多个子元素时,鼠标在子元素间移动会引发多次mouseover和mouseout事件,这在多数情况下并不是我们期望的。而hover事件因为使用了mouseenter和mouseleave,所以在这种场景下能更精确地...

    鼠标事件特效鼠标事件特效鼠标事件特效

    - `mouseout`:当鼠标离开元素或其子元素时触发。 - `mouseenter` 和 `mouseleave`:这两个事件更精确地处理进入和离开,不被子元素影响。 2. **事件监听**:要实现鼠标事件特效,我们需要监听这些事件。在...

    判断mouseenter事件鼠标从哪个方向进入

    这两个事件是DOM级别的,与`mouseover`和`mouseout`不同,它们不会因为子元素的存在而被错误触发。当鼠标进入一个元素或离开一个元素时,这两个事件会被精确地触发。 要判断鼠标进入元素的方向,我们通常需要记录...

    IE中鼠标经过option触发mouseout的解决方法

    当鼠标从一个元素移动到另一个元素(包括其子元素)时,`mouseout`事件通常不会被触发。然而,在IE浏览器中,这个行为在处理`&lt;select&gt;`元素和其子`&lt;option&gt;`元素时有所不同。 问题在于,当用户在`&lt;select&gt;`下拉列表...

    IE应用了filter后mouseover事件异常

    然而,当一个元素应用了filter属性,并且该元素或者其子元素绑定了mouseover事件,IE浏览器可能无法正确触发或处理这个事件。问题可能出在IE的渲染引擎如何同时处理滤镜效果和DOM事件。具体表现为事件监听器可能不会...

Global site tag (gtag.js) - Google Analytics