绝对定位元素遮盖其它元素的bug
来源:互联网 发布:centos ruby gem 安装 编辑:程序博客网 时间:2024/06/05 00:51
有时需要用绝对定位元素去遮盖其它元素。多数时候没有什么问题。如果被遮盖的元素添加了鼠标事件(如点击事件),各浏览器下表现则不太一样了。
1,绝对定位元素(未设置background)遮住Input元素,只在IE/Opera中,Input的点击事件能触发。如下代码
Div[class=container]中有子元素Input,其添加了鼠标单击事件;另一个子元素Div设置了绝对定位,top,left都为0。这样就遮盖住了Input元素。这是点击Input,看看各浏览器中的表现:
IE6/7/8/OperaFirefox/Safari/Chrome点击Input[value=click me]弹出提示框:clicked不弹
很奇怪,IE6/7/8/Opera中虽然绝对定位的div盖住了input,但点击input,仍然能触发其点击事件。而Firefox/Safari/Chrome则不会触发。
2,绝对定位元素(设置background)遮住Input元素,所有浏览器中均无法触发Input的点击事件。如下:
这时候在所有浏览器中点击input都无法触发其点击事件,也不会弹出clicked。
3,相对定位的元素(未设置背景色)能盖住绝对定位的元素,也只在IE/Opera中能触发Input点击事件,如下:
4,相对定位的元素(设置背景色)能盖住绝对定位的元素,所有浏览器中均无法触发Input点击事件,如下:
测试浏览器版本如下:
IE6/7/8
Opera 10.10
Firefox 3.5.6
Safari 4.0.3
Chrome 4.0.266.0
- 绝对定位元素遮盖其它元素的bug
- 元素的相对定位与绝对定位
- 元素绝对定位 V2
- 绝对定位元素居中
- 绝对定位元素的居中实现
- 相对于父元素的绝对定位
- 绝对定位的元素怎么居中显示
- 让绝对定位的元素居中
- 绝对定位元素的水平垂直居中
- IE6 下父级(relative)使用padding后,子元素绝对定位(absolute)的bug
- 关于元素绝对定位的父元素问题
- IE7局部滚动区域下绝对定位或相对定位元素不随滚动条滚动的bug
- 【CSS】IE7局部滚动区域下绝对定位或相对定位元素不随滚动条滚动的bug
- 关于页面元素的绝对定位和相对定位
- 居中相对定位和绝对定位的元素
- 元素绝对定位(修改版本)
- 当浮动元素和绝对定位元素是并列关系的时候,在IE6下绝对定位元素会消失
- IE6 绝对定位元素的 1px 间距 bug(转自:http://www.99css.com/archives/53)
- [转] 高性能嵌入式处理器时代来临!多家中国芯片设计公司选择ARM® Cortex™-A9和Mali™图形处理器技术
- Android源码
- 采用curl库在PHP程序之间传递数组[转载]
- 网站常用css
- 使用CMake构建项目的简明示例(1)
- 绝对定位元素遮盖其它元素的bug
- 关于cssText属性
- 两个通用方法的理解 Equals 方法和 HashCode方法(转载)
- IE中浮动元素折行bug
- 懂的这23条。你就成熟了
- SSIS数据校验
- 对Hadoop执行分布式计算作业的理解
- 面向对象编程中的三个重要机制
- .NET程序调用SSIS中的DTS包