<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. mybatis-generator运行命令

    java -jar mybatis-generator-core-x.x.x.jar -configfile generatorConfig.xml -overwrite

  2. 【整理】Linux下中文检索引擎coreseek4安装,以及PHP使用sphinx的三种方式(sphinxapi,sphinx的php扩展,SphinxSe作为mysql存储引擎)

          一,软件准备 coreseek4.1 (包含coreseek测试版和mmseg最新版本,以及测试数据包[内置中文分词与搜索.单字切分.mysql数据源.python数据源.RT实时索引等测 ...

  3. 【原创】PageAdminCMS 前台SQL注入漏洞(2)

    之前根据公司的要求找了几个web程序的漏洞提交CNVVD,发现漏洞提交上去两个月了,CNVVD却没有任何回应,我提交的这几个漏洞却悄悄的修补掉了. 文章作者:rebeyond 受影响版本:V3.0 漏 ...

  4. ThinkphpCMF笔记

    1.模板js,css文件__PUBLIC__ <link href="__TMPL__Public/style.css" rel="stylesheet" ...

  5. eclipse配置tomcat

    1eclipse默认是用workspace的comcat,要把它配置成我们自己的外部tomcat,并且发布路径修改为webapps 2设置tomcat的启动和关闭时间 3如果要发布到tomcat根目录 ...

  6. Mybatis学习总结(一)——入门基础

    一.Mybatis介绍 1.MyBatis是什么? MyBatis 本是apache的一个开源项目iBatis, 2010年这个项目由apache software foundation 迁移到了go ...

  7. C# 反射研究

    概念 反射这东西,对于我这种小白,听起来总是觉得好大上的. 当初理解它费了一点时间,后来看了一句话,突然恍然大悟,“反射就跟B超一样,我们在不剖开人体的情况下想看清楚内部情况, 我们就通过发射超声波, ...

  8. leetcode--Majority Element

    题目链接:https://leetcode.com/problems/majority-element/ 算法类型:分治法 题目分析:获取长度为n的数组中的众数(出现次数大于等于⌊ n/2 ⌋) 代码 ...

  9. 【学习笔记】Servlet的配置

    为了让Servlet能响应用户的请求,需要将Servlet配置在Web应用中. 从Servlet3.0开始,配置Servlet有两种方式: l 在Servlet类中使用@WebServlet Anno ...

  10. [IOS]JSPatch

    用途 修复线上出现的紧急crash,热更新 例子 demo 原理解读 在程序didFinishLaunch时候执行,[JPEngine startEngine], startEngine做了对解析js ...