<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. Net中对Object的定义

    如果你问一个.Net程序员什么是Object,他可能会信誓旦旦的告诉你"Object还不简单吗,就是所有类型的基类"这个答案是对的,但是不足以说明Object真正是什么 好在HTM ...

  2. JS中SetTimeOut和SetInterval方法的区别?

    1.setInterval() 方法可按照指定的周期(以毫秒计)来调用函数或计算表达式. setInterval() 方法会不停地调用函数,直到 clearInterval() 被调用或窗口被关闭.由 ...

  3. [Algorithm] 局部敏感哈希算法(Locality Sensitive Hashing)

    局部敏感哈希(Locality Sensitive Hashing,LSH)算法是我在前一段时间找工作时接触到的一种衡量文本相似度的算法.局部敏感哈希是近似最近邻搜索算法中最流行的一种,它有坚实的理论 ...

  4. NSIS检测.NET Framework并在线下载

    Section -.NET Framework ;检测是否是需要的.NET Framework版本 Call GetNetFrameworkVersion Pop $R1 ;${If} $R1 < ...

  5. 07-本地 YUM 源制作

    1.YUM相关概念 1.1.什么是YUM YUM(全称为 Yellow dog Updater, Modified)是一个在Fedora和RedHat以及CentOS中的Shell前端软件包管理器.基 ...

  6. python爬虫小项目实战

  7. libvirt 网络手册(一)

    如果选择网络类型 在一个专用的服务器上,虚拟机常常需要被从公网访问(也就是每个虚拟机都需要公网地址),这时就需要桥接网络,它使得每个虚拟机有自己的IPV4和IPV6地址.如果桥接不可用,可以创建一个R ...

  8. HTTP连接管理

    本文是<HTTP权威指南>读书笔记: 几乎所有的HTTP通信都是通过TCP/IP承载的,当HTTP要传送一些报文时,会以流的形式将报文数据的内容通过一条打开的TCP连接按序传输.因此HTT ...

  9. [转载]PV操作简单理解

      原文链接:http://blog.csdn.net/liushuijinger/article/details/7586656 进程通常分为就绪.运行和阻塞三个工作状态.三种状态在某些条件下可以转 ...

  10. Android获取屏幕宽度高度

    方法一: WindowManager wm = (WindowManager) this .getSystemService(Context.WINDOW_SERVICE); int width = ...