IE6 select穿透问题(div 定位无法遮盖select)!
此问题,早有耳闻,可是一直都没有亲身碰到过,也就没有过多的去在意这些问题。
这一回总算是见识到了ie的厉害。虽是在ie选项中大大的写着ie版本号是ie11 。可是有些部分确实走的ie6的内核。怪不得微软天天在各种window update.
解决此问题的方法非常easy。给你须要显示的内容的后面加一个iframe,让他去挡住select不要穿透过来。这样世界就算是清净了。
例如以下html:
<body>
<div>
<select>
<option value="">select穿透问题</option>
<option value="">select穿透问题</option>
</select>
</div>
<div class="wrap" style="position:relative;width:200px;height:200px;">
<div class="content">须要显示的内容</div>
<iframe class="ie-select-iframe" style="position:absolute;top:0;left:0;z-index:-1;width:200px;" scrolling="no" frameborder="0"></iframe>
</div>
</body>
这里须要注意的是:
1 wrap仅仅是一个容器,所以border之类的样式。最好不要放在这里,由于这个div是会被select穿透的。
2 iframe的宽度最好给一个值,在ie6下,要使用100%。似乎还要做一些别的设置。须要给,html,body都给height:100%,才干实现。否则在ie6下无效。
IE6 select穿透问题(div 定位无法遮盖select)!的更多相关文章
- IE6下div遮盖select的最优解决方案
a.本节精选html5/css频道里一款IE6下div遮盖select的最优解决方案 原理:利用iframe来遮挡select,再用div来遮挡iframe,就这么简单. 1)首先,建一个div层和i ...
- 【IE6的疯狂之五】div遮盖select的解决方案
IE6以及一下版本下,选择框Select会覆盖Div中的内容一般情况下,可以将显示的内容放到Iframe中,然后再显示框架内的内容.由于Iframe的可以显示在Select上层,就可以解决这个问题.不 ...
- 解决IE6下浮动层固定定位的经典方法
<!DOCTYPE html> <html> <head> <meta charset="UTF-8"> <title> ...
- selenium自动化实例: 多层框架中关于iframe的定位,以及select下拉框选择
对于一个自动化的初学者来说会很常见的遇到元素明明存在却始终定位不到, 从而导致脚本报错,当然定位不到元素的原因很多, 其中一种就是多层框架iframe导致的 下方截图示意: 下方为写脚本时候的示例并其 ...
- IE6浏览器不支持固定定位(position:fixed)解决方案(转)
IE6浏览器不支持固定定位(position:fixed)解决方案 来源:互联网 作者:佚名 时间:12-04 10:54:05 [大 中 小] 点评:有些朋友在进行网页布局时,会遇到IE6浏览器 ...
- html中div定位练习
html中div定位练习,实现简单的计划列表: 记录div定位时主要的属性:float.position等,以及对应的relative和absolute等,同时使用到angular js中的数据绑定, ...
- div定位
1.float定位带来的问题<html> <head> <title>div浮动引发的问题</title> </head> <styl ...
- 自己写的一个用js把select换成div与span与ul的东西
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/ ...
- div定位relative和absolute测试1
div里的position定位也是比较常见的,relative是相对定位,absolute是绝对定位.如本文测试:body自带8px的margin,这里不对其进行清空.蓝色的div和红色的div分别设 ...
随机推荐
- ActiveReports 报表应用教程 (10)---交互式报表之向下钻取(详细数据按需显示解决方案)
在葡萄城ActiveReports报表中可以动态的显示或者隐藏某区域的数据,通过该功能用户可以根据需要显示或者隐藏所关心的数据,结合数据排序.过滤等功能可以让用户更方便地分析报表数据. 本文中展示的是 ...
- 安卓测试【一】android sdk环境变量配置
移动应用自动化测试的配置,先于官网下载Android SDK,然后配置环境变量. 配置android sdk环境变量 1. 新建ANDROID_HOME环境变量,变量值为SDK解压的路径 2. 追加 ...
- unity 获取水平FOV
unity中Camera的Field of View是指的垂直FOV,水平FOV可以经过计算得到. 创建脚本如下,把脚本挂载到摄像机上即可得到水平FOV: public class GetHorizo ...
- 声明元素<%! %>、Scriptlet元素<% %>、表达式元素<%= %>、注释元素、输出特殊符号<%和%>
声明元素 <%! 类成员声明或方法声明 %> 在声明元素中编写的代码,将转译为Servlet中的类成员或方法. 重新定义jspInit()方法,或是在jspDestroy(),就是在声明元 ...
- 几个python函数
迭代器 fun函数 过滤作用 s=['a', 'b', 'c'] def fun1(s): if s!='a': return s ret filter(fun1, str) print(ret) ...
- 使用 Azure CLI 创建 Windows 虚拟机
Azure CLI 用于从命令行或脚本创建和管理 Azure 资源. 本指南详细介绍如何使用 Azure CLI 部署运行 Windows Server 2016 的虚拟机. 部署完成后,我们连接到服 ...
- Oracle EBS OM 已存在的OM订单增加物料
DECLARE l_header_rec OE_ORDER_PUB.Header_Rec_Type; l_line_tbl OE_ORDER_PUB.Line_Tbl_Type; l_action_r ...
- maven+spring+junit测试要注意的事情
使用maven方式创建webapp工程的资料网上一大堆,在这里也不详细说了.在创建完成之后,里面说到要转动态web工程时要切换为3.0版本,但是我本地切换不了,网上的方法好像也没用,暂时也没用到这块. ...
- PowerDesigner Code和Name设置大写tablespace设置,PK设置
1,PowerDesigner Code和Name设置大写 tool>MODEL OPTIONS 2.从oracle数据库导出的表结构默认包含了tablespace 删除tablespace方法 ...
- MySQL 8.0.2: Introducing Window Functions
July 18, 2017MySQL, SQLDag Wanvik MySQL 8.0.2 introduces SQL window functions, or analytic functions ...