2 porry123 porry123 于 2015.05.30 15:25 提问

onmouseover不触发,望指教

a标签似乎是被覆盖了,但是找不到问题根源。z-index属性修改没有效果

CSS

 .demo{  width:1000px; height:442px; overflow:hidden;margin:0px;z-index:-1; padding:0px; position:relative; }
.num { bottom: 10px; right: 50px; width:auto;height:8px;z-index:10; position:absolute;}
.num a{cursor:pointer;  width:8px; height:8px; background:url(../images/bicon_bg.png) no-repeat bottom; margin-right:4px; float:left;display:inline-block; border:1px solid red;position:relative;z-index:50;}
.num a:hover {cursor:pointer; background:#ff7d01; width:8px; height:8px; display:block; color:#fff; }
.demo ul {position:relative;z-index:5;width:956px; }
.demo ul li {position:absolute; display:none; margin:0px;padding:0px;width:1000px; }
.demo ul li .demo-img{ width:1000px;height:442px;float:left; display:inline; }
.demo ul li .demo-img img{ width:1000px; height:442px;}
.demo .num a.cur{ background:url(../images/bicon_bg.png) no-repeat top; display:block;}

前端是这样的结构

 <div class="demo">
                            <div class="num">
                                                                        <a href="#" class='cur'></a>
                                                                        <a href="#" ></a>
                                                                        <a href="#" ></a>                                                                       
                                                        </div>
                            <ul>
                                <li style='DISPLAY: block' ><img src='imagestext/20140916064258.jpg'  width="1000" height="442"></li> 
                                 <li  ><img src='imagestext/20130531030129.jpg'  width="1000" height="442"></li> 
                                  <li  ><img src='imagestext/20140905105755.jpg'  width="1000" height="442"></li>                                  
                            </ul>
                        </div>

6个回答

showbo
showbo   Ds   Rxr 2015.05.30 20:27
已采纳

.demo你设置z-index为-1不就到body后面了。。当然获取不到焦点了,去掉z-index:-1

     .demo {
        width: 1000px;
        height: 442px;
        overflow: hidden;
        margin: 0px;
       /* z-index: -1;*/
        padding: 0px;
        position: relative;
    }
porry123
porry123 恩,不应该给-1的,是我对z-index理解不够。现在可以了,谢谢
大约 3 年之前 回复
u012216727
u012216727   Ds   Rxr 2015.05.30 16:57

是你Javascript代码写的有点问题吧,你仔细找找,我的挺好的,或许onmouseover和hover有点冲突。

porry123
porry123 不是功能部分的问题,现在已经解决了,多谢了
大约 3 年之前 回复
GX_LiangWenLong
GX_LiangWenLong   2015.05.30 16:28

用document.getElementById('id').onmouseover = function () { }试下

tbwangxw
tbwangxw   2015.05.30 16:33

ie6、7不支持 a:hover ,如果要实现此功能,需要添onmouseover事件响应

yy839126257
yy839126257   2015.05.31 11:40

覆盖问题用 z-index解决,不起作用的话,你把这个事件用行内式写一写试一试

porry123
porry123   2015.05.31 13:42

问题解决了,感谢各位老师不吝赐教

Csdn user default icon
上传中...
上传图片
插入图片
准确详细的回答,更有利于被提问者采纳,从而获得C币。复制、灌水、广告等回答会被删除,是时候展现真正的技术了!
其他相关推荐
onmouseover和onmouseout的烦人问题
一个DIV层,当鼠标移进的时候会触发onmouseover,移出的时候会触发onmouseout。   很简单的逻辑,这也是我们想要的!但随之烦恼也就来了:onmouseover并不会只在移进时才触发,onmouseout也不会只在移出时才触发!鼠标在DIV里面移动时也会可能触发onmouseover或onmouseout。   在上图中,对于’A'
IE6下js的onmouseover和onmouseout事件连续触发闪烁解决方法
解决HTML内部元素的Mouse事件干扰  话说有一个DIV元素,其内部有一个IMG元素和SPAN元素,不用理会这两个内部元素怎么布局,这不是我要讨论的重点。  为了实现一些特殊的效果,我需要利用TD的onmouseover和onmouseout事件,测试时就会发现如下的状况:  当鼠标移入DIV内部时,onmouseover事件被触发;接着再鼠标移动到DIV内部的IMG或者SP
解决内部元素onMouseOver/onMouseOut事件冒泡触发父元素的相应事件
前阵子为BS项目模板做了一个左侧滑动信息栏,效果类似于windows状态栏的自动隐藏效果,鼠标移进滑出,鼠标移出隐藏,浮动时不占用空间,也可以固定住占一块位置。做的过程中遇到一个问题,鼠标在信息栏内部移动时会触发onMouseOut事件,信息栏放在div中,内部有table、img、a等元素,看来是由于事件冒泡,子元素上触发了事件冒泡到了父元素,导致滑动时不断闪动,头晕眼花,于是着手解决问题。
js避免onmouseover onmouseout多次触发
//------------------------------------------------------------ function contains(parentNode, childNode)  {     if (parentNode.contains) {         return parentNode != childNode && parentNode.conta
内部元素导致onmouseout,onmouseover事件调用问题
如下图所示,这是我要的效果。就是,当鼠标移动到链接上面的时候,弹出框框。当鼠标移走时框框消失。 但是在实现这个效果的时候发生如标题所示的C蛋的事情。那就是当我鼠标移动到框框中文字上面的时候,框框也消失了。 百度了一下,发现许多人也存在这样的问题。解决的方法的各不相同。我差点就被带进坑。所以说百度须谨慎啊。 最终我发现了一个最快捷,最方便的方法。那就是不要用onmouseout
setAttribute()添加了事件属性,却无法触发事件的问题
来自CSDN技术社区想解决如下问题:用getElementById()获得节点A位置,接着用y=getElementsByTagName("div")获得节点A下所有div标签元素,然后在循环中用y.item(i).setAttribute("onclick","treeClick()")使div元素获得onclick属性。在调试中发现div元素确实有了onclick属性,但却不会触发。不知道是什
onmouseout,mouseover经过子元素也触发的问题解决方案(兼容)
在mouseout与mouseover的冒泡问题上,相信有很多朋友都遇到过。今天这里就总结一下关于mouseover和mouseout冒泡问题的解决方案:   首先,看下event.relatedTarget的用法。 relatedTarget 事件属性返回与事件的目标节点相关的节点。 relatedTarget不支持IE。 对于 mouseover 事件来说,该属性
鼠标事件 onmouseenter 和 onmouseover 的区别
鼠标事件以一下代码为例 123     456 function add(){ console.log('father'); } function delect(){ console.log('son'); } 当为onmouseenter时不会冒泡,及不会重复触发父级事件,在进入父级时也不会触发子级事件。 当为onmouseover时会冒泡,只要进入到标签内就会触
浅谈前端中的onmouseover 事件
修改别人的模板遇到一个问题,分类图的切换默认是五个,我想增加四个,一直没有增加成功。它使用的onmouseover 事件。 去查了一下: 定义和用法 onmouseover 事件会在鼠标指针移动到指定的对象上时发生。 语法 onmouseover="SomeJavaScriptCode" 参数 描述 SomeJavaScriptCod
JavaScript_通过onmouseover onmouseout 部分显示与隐藏
我们时常遇见这样的问题,后台的数据 或者 大段的文章其需要部分显示, 只有当我们鼠标移动上去的时候才显示全部的内容。 这时候我们就可以通过javascript/jquery 进行处理,判断内容的长度,如果内容过长就显示其中的一部分。 期望效果: 鼠标未移动到指定区域,显示的内容 鼠标移动到区域,显示的内容 这里有个小陷阱,就是第一次我们打开网页的时候我