IE 6 position不支持fixed属性的解决方案
抛出另一个问题:IE7已经支持position:fixed了,而IE6却不支持,解决这个问题的办法如下:
现在有一个元素的id是element,它需要实现fixed效果,我们既想要它在正常的浏览器下使用,也想要它在IE 6下正常工作,那么可以使用CSS hack:
#element {
position: fixed;
top: 450px; /* 其他浏览器下定位,在这里可设置坐标*/
_position: absolute; /*IE6 用absolute模拟fixed*/
/*IE6 动态设置top位置*/
_top: expression(eval(document.documentElement.scrollTop) + 450);
}
这样就可以实现这个元素距离顶部450像素固定,你还可以添加下面的代码实现去除页面抖动的效果:
*html body{
background-image:url(about:blank);
background-attachment:fixed;
}
在前文中,通过_top设置CSS样式,那么怎么修改expression的样式呢:
var domThis=$(this)[0];
domThis.style.setExpression(
'top', 'eval((document.documentElement).scrollTop + ' + 50 + ')'
);
通过这种方式,就可以达到修改的目的了。
-------------------------------------------------------------------------------------------------------------------------------------
本文非原创,转载自: http://www.tonitech.com/1505.html
IE 6 position不支持fixed属性的解决方案的更多相关文章
- IOS系统不兼容position: fixed;属性的解决方案
position: fixed;属性在IOS系统手机上会有很明显的抖动,解决方式: 只需要在中间部分外层div添加css样式position:fixed;top:50px; bottom:50px;o ...
- 解决IE6不支持position:fixed属性
最近在优化网站浮动广告时候遇见了IE6不支持position:fixed属性.上网收集了一下解决方案 比较好的方案就是利用css表达式进行解决 补充:CSS Expression (CSS 表达式), ...
- 元素设置position:fixed属性后IE下宽度无法100%延伸
元素设置position:fixed属性后IE下宽度无法100%延伸 IE bug 出现条件: 1.div1设置position:fixed属性,并且想要width:100%的效果. 2.div2(下 ...
- (转)实例详解CSS中position的fixed属性使用
关于fixed属性,在什么情况下需要用,怎么用,首先,我们应该先了解下fixed属性的说明:fixed总是以body为定位时的对象,总是根据浏览器的窗口来进行元素的定位,通过"left&qu ...
- 解决ie6下不支持fix属性,模拟固定定位
<!DOCTYPE HTML> <html> <head> <meta http-equiv="Content-Type" content ...
- css中的position:relative和absolute 属性
语法: position : static | absolute | fixed | relative 取值: static :默认值.无特殊定位,对象遵循HTML定位规则 absolute :将对象 ...
- position的四个属性值
1.relative2.absolute3.fixed4.static下面分别讲述这四个属性. <div id="parent"> <div id="s ...
- 谈一谈手机WebApp的fixed属性(手机上的固定栏)【转】
1.iphone/android原生app常见结构 似乎,所有的手机应用,都遵循这样的布局:固定的顶部+固定的底部+可滚动在中间区域.这种“雷同”的模式让人恶心,却不得不承认这是一种很规矩却又很实用的 ...
- 【学习笔记】HTML position(static、fixed、relative、absolute)
[本文转载] position的四个属性值:static.fixed.relative.absolute 下面分别讲述这四个属性:<div id="parent"> ...
随机推荐
- Python 3基础教程29-os模块
本文介绍os模块,主要是介绍一些文件的相关操作. 你还有其他方法去查看os 1. help() 然后输入os 2. Python接口文档,前面提到的用浏览器打开的,os文件路径为:C:\Users\A ...
- Oracle修改表字段类型(number-->varchar2(len)),亲测可用
思路: --新建临时表以存储正确的顺序create table A_2 as select (column1,colum2,……A表中的顺序) from A_1 ; --删除表A_1drop tabl ...
- 在阿里云上遇见更好的Oracle(四)
2016.5.13,北京,第七届数据库技术大会. 从最初的itpub社区,到后来被it168收购,DBA社区的线下聚会发展成2010年第一届数据库技术大会(DTCC).第一届大会汇聚了社区内活跃的各位 ...
- LeetCode 389——找不同
1. 题目 2. 解答 2.1. 方法一 将 s 和 t 转化为 Python 的列表,然后遍历列表 s 的元素,将它们从列表 t 中删除,最后列表 t 中会余下一个元素,即为所求. class So ...
- nohup追加日志
背景:用脚本部署Spring Boot应用,用nohup命令进行后台运行 之前的日志处理: nohup command > myout.file 2>&1 & 导致每次用s ...
- 第5讲——cin处理字符输入
本来这一讲应该是while.for.if之类的,但是,我们可是学过C的男人,再浪费时间搞这个??? 还不如学点C++中的新知识. cin对象支持3种不同模式的单字符输入,其用户接口各不相同. 下面我们 ...
- Python标准模块logging
http://blog.csdn.net/fxjtoday/article/details/6307285 开发Python, 一直以来都是使用自己编写的logging模块. 比较土...... 今天 ...
- js中迭代元素特性与DOM中的DocumentFragment类型 笔记
JS中迭代元素特性 在需要将DOM结构序列化为XML或者HTML字符串时,多数都会涉及遍历元素的特性,这个时候attributes属性就可以派上用场. 以下代码展示了如何迭代元素的每一个特性,然后将他 ...
- Eclipse下JRebel6.5.0热部署插件安装、破解及配置
发现一个问题:如果安装了jRebel,但是并未对项目添加jRebel监听时,如果重写jar包中的类, 虽然重写后的类会得到编译(classes中的class已经是修改后的class),但是并不会调用重 ...
- 高效的序列化组件 Protobuf-net
什么是ProtoBuf-net Protobuf是google开源的一个项目,用户数据序列化反序列化,google声称google的数据通信都是用该序列化方法.它比xml格式要少的多,甚至比二进制数据 ...