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"> ...
随机推荐
- jsp 添加jstl标签
jsp页面中添加下列代码即可使用jstl标签. <%@ taglib uri="http://java.sun.com/jsp/jstl/core" prefix=" ...
- 「日常训练」 Soldier and Traveling (CFR304D2E)
题意 (CodeForces 546E) 对一个无向图,给出图的情况与各个节点的人数/目标人数.每个节点的人只可以待在自己的城市或走到与他相邻的节点. 问最后是否有解,输出一可行解(我以为是必须和答案 ...
- 第二十一篇 json,picklz,xml模块
Json模块 Json模块比较简单,仅有四个方法dumps()和loads()方法,dump()和load()方法,但是却非常的常用,实用性极强. 如果要在不同的编程语言之间传递对象,就必须把对象序列 ...
- Django打造大型企业官网
第1章 Django预热 1-为什么需要虚拟环境 2-virtualenv创建虚拟环境 3-virtualenvwrapper使用 4-URL组成部分讲解 5-课程准备工作 6-Django介绍 第2 ...
- Java中大数的使用与Java入门(NCPC-Intergalactic Bidding)
引入 前几天参加湖南多校的比赛,其中有这样一道题,需要使用高精度,同时需要排序,如果用c++实现的话,重载运算符很麻烦,于是直接学习了一发怎样用Java写大数,同时也算是学习Java基本常识了 题目 ...
- bzoj1367 可并堆
题面 参考:<左偏树的特点及运用--黄河源> 我们将这个数列划为很多个互不相交的区间,每一段区间内的 \(b\) 是相等的,即 \(b[l[i]]=b[l[i]+1]=...=b[r[i] ...
- 剑指offer-二进制中1的个数11
题目描述 输入一个整数,输出该数二进制表示中1的个数.其中负数用补码表示. class Solution: def NumberOf1(self, n): # write code here coun ...
- C++STL——堆栈
一.相关定义 原理:stack队列是一个线性存储表,插入和删除只在栈顶进行,从而构成了一个后进先出LIFO表. 入栈&出栈:元素的插入称为入栈,元素的删除称为出栈. stack是一种关联容器, ...
- java script 学习
用JavaScript输出文本 <p>我的第一个段落.</p> <script> document.write(Date()); </script> & ...
- java计算两个日期之间的相隔天数
[原创] 之前在很多竞赛的题目中有这样饿一类题,计算给定两个日期之间的相隔天数,或者很多类似的题目,都是需要转化到这个问题上时,之前用c++写的时候思想是这样的,一个结构体,包括年月日,还有一个计算下 ...