<div id="append_parent" style="position: relative;">
<div id="zoomimglayer" style="position: absolute; padding: 0px; left: 551.5px; top: 142px;
width: 800px; height: 439px; cursor: pointer;" class="popupmenu_popup">
<img id="zoomimg" style="cursor: move; margin: 5px; z-index: 1000; position: absolute;"
src="http://www.orico.com.cn/images/2013925141939458.jpg" width="800" height="543">
</div>
<div id="zoomimglayer2" style="position: absolute; padding: 0px; left: 551.5px; top: 142px;
width: 800px; height: 439px; cursor: pointer;" class="popupmenu_popup">
<div id="dprev" title="上一张" style="position: absolute; left: 0; top: 20px; z-index: 1001;
cursor: pointer; width: 40%; height: 523px;" onclick="alert('上一张')">
<a style="top: 271.5px; position: absolute;" class="prev">上一张</a>
</div>
<!-- .main -->
<div id="dnext" title="下一张" style="position: absolute; right: 0; top: 20px; z-index: 1001;
cursor: pointer; width: 40%; height: 523px;" onclick="alert('下一张')">
<a style="position: absolute; top: 271.5px; right: 0;" class="next">下一张</a>
</div>
</div>
</div>

以上HTML定义一个父类相对定位,子元素绝对定位。

在ie下,元素zoomimglayer2 被 元素zoomimglayer 覆盖了。



而在子元素zoomimglayer2上设置background样式才管用。求前端高手指点一下啊! 

<div id="append_parent" style="position: relative;">
<div id="zoomimglayer" style="position: absolute; padding: 0px; left: 551.5px; top: 142px;
width: 800px; height: 439px; cursor: pointer;" class="popupmenu_popup">
<img id="zoomimg" style="cursor: move; margin: 5px; z-index: 1000; position: absolute;"
src="http://www.orico.com.cn/images/2013925141939458.jpg" width="800" height="543">
</div>
<div id="zoomimglayer2" style="position: absolute; padding: 0px; left: 551.5px; top: 142px;
width: 800px; height: 439px; cursor: pointer;background: url(data:image/gif;base64,R0lGODlhAQABAIAAAAAAAP///yH5BAEAAAAALAAAAAABAAEAAAIBRAA7);" class="popupmenu_popup">
<div id="dprev" title="上一张" style="position: absolute; left: 0; top: 20px; z-index: 1001;
cursor: pointer; width: 40%; height: 523px;" onclick="alert('上一张')">
<a style="top: 271.5px; position: absolute;" class="prev">上一张</a>
</div>
<!-- .main -->
<div id="dnext" title="下一张" style="position: absolute; right: 0; top: 20px; z-index: 1001;
cursor: pointer; width: 40%; height: 523px;" onclick="alert('下一张')">
<a style="position: absolute; top: 271.5px; right: 0;" class="next">下一张</a>
</div>
</div>
</div>
 

父元素相对定位后,子元素在ie下被覆盖的问题!的更多相关文章

  1. 【IE6的疯狂之十】父级使用padding后子元素绝对定位的BUG

    在前端开发中,经常会用到css的position:absolute来使层浮动,前通过left,top,right等属性来对层进行定位,但ie6对left,top,right等属性的解释和ie7,ie8 ...

  2. angular 中父元素ng-repeat后子元素ng-click失效

    在angular中使用ng-repeat后ng-click失效,今天在这个上面踩坑了.特此记录一下. 因为ng-repeat创造了新的SCOPE.如果要使用这个scope的话就必须使用$parent来 ...

  3. 父元素设置min-height子元素设置100%问题

    问题:父元素设置min-height子元素高度设置100%取不到值,这是因为子元素 div设置 height:100%: 只有当父级元素满足min-height:1000px;设置的条件才触发: 浏览 ...

  4. AngularJs中,如何在父元素中调用子元素为自定义Directive中定义的函数?

    最近一段时间准备使用AngularJs中的自定义Directive重构一下代码. 在这里说明一下,把自定义控件封装成Directive并不一定是要复用,而是要让代码结构更加清晰.就好像你将一个长方法拆 ...

  5. CSS实现父元素半透明,子元素不透明

    CSS实现父元素半透明,子元素不透明. 很久以来大家都习惯使用opacity:0.5在新式浏览器里实现半透明,而对IE较旧的版本使用filter:Alpha(opacity=0.5)的滤镜来实现半透明 ...

  6. CSS父元素高度随子元素高度变化而变化

    <html> <body> <head> <style> #menu{width:1000px;overfloat:hidden;} /* width: ...

  7. 当fixed元素相互嵌套时chrome下父元素会影响子元素的层叠关系

    问题:fixed元素被另一个fixed元素包含的时候在chrome下fixed子元素的定位会受到父元素的影响. demo(http://jsbin.com/qumah/1): <!DOCTYPE ...

  8. 当fixed元素相互嵌套时,父元素会影响子元素的层叠关系,最好不要嵌套使用fixed

    问题:fixed元素被另一个fixed元素包含的时候在chrome下fixed子元素的定位会受到父元素的影响. 解释:层叠关系是受层叠上下文影响的.文档中的层叠上下文由满足以下任意一个条件的元素形成: ...

  9. 二、vue学习--父元素如何获取子元素的值,子元素如何获取父元素的值

      下图是父元素: 下图是子元素,获取父元素的值,使用props定义属性,这样就可以获取到父元素上传过来的set .place.type,拿到值就可以做一些自己的逻辑处理 二.子元素给父元素传值? 下 ...

随机推荐

  1. mac显示隐藏文件

    苹果Mac OS X操作系统下,隐藏文件是否显示有很多种设置方法,最简单的要算在Mac终端输入命令. 显示/隐藏Mac隐藏文件命令如下(注意其中的空格并且区分大小写): 第一种 显示Mac隐藏文件的命 ...

  2. 【学习笔记】JAva编程思想之多态

    1.如果java的基类拥有某个已被多次重载的方法名称,那么在导出类中重新定义该方法名称并不会屏蔽在基类的任何版本.因此,无论是在该层或者他的基类中对方法进行定义,重载机制都可以正常工作. 2.使用@O ...

  3. MAC OS升级到10.11(OS X EICAPTION)之后CocoaPods不能正常使用的问题解决

    昨晚回家之后开始升级系统到10.11,下载了一整个晚上之后终于在早上下载完毕,早上带到公司,想查一个第三方库的时候却遇到了问题: guoyufudeMacBook-Pro:~ GuoYufu$ pod ...

  4. 在SQL中 给字符串补0方法

    --第一种方法SELECT RIGHT('00000'+CAST(ID AS nvarchar(50)),5) FROM dbo.TableName --左边补0,如 00001,00039 SELE ...

  5. mysql 目录的了解以及Linux

    Linux   目录                描述 /                                                                       ...

  6. Android获取位置信息的方法总结

    1.位置服务的简介:位置服务,英文翻译为Location-Based Services,缩写为LBS,又称为定位服务或基于位置的服务,融合了GPS定位.移动通信.导航等多种技术,提供与空间位置相关的综 ...

  7. JS树形菜单

    超全的JS树形菜单源代码共享(有实例图) 树形菜单是很常用的效果,常用在管理软件当中,但是一套树形菜单已经不能满足需求,所以如果能有一套比较全面的树形菜单JS特效代码,将会非常方便,下面懒人萱将超全的 ...

  8. session、cookie浅见

    万事开头难,刚开始不一定能写好博文,不,应该是一定写的不好,但我定会用心. 以前只知道session是存在服务器,cookie是存在客户端,至于它们工作的原理就不了解了.为了巩固自己记忆,小小的总结了 ...

  9. PHP之compact()函数

    PHP之compact()函数 compact()函数将变量转化为数组: <?php //直接调用函数 $a=1;$b=3;$c=4; var_dump($a,$b,$c); //自定义函数实现 ...

  10. bzoj4555题解

    我们计算$f(i)=\sum_{j=1}^i S(i,j)\times 2^j\times (j!)$,容(o)易(e)知(i)道(s)$f(i)$的指数生成函数为$\frac{1}{3-2\time ...