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"> ...
随机推荐
- spring-boot分页插件
1.分页插件,spring-boot.,第一次调用时,存值到 model.addAttribute("status", id);页面获取2.页面获取 后台存入的值,放在input ...
- MySQL 5.6查看数据库的大小
1. use information_schema; 2. select concat(round(sum(data_length/1024/1024),2),'MB') as data from t ...
- flex builder 4
下载地址(需要登录):http://trials.adobe.com/AdobeProducts/FLBR/4/win32/FlashBuilder_4_LS10.exe 很全的在线帮助文档:http ...
- PAT 1084 外观数列
https://pintia.cn/problem-sets/994805260223102976/problems/994805260583813120 外观数列是指具有以下特点的整数序列: d, ...
- vue-component=>v-on
$emit 返回 shouldPropagate,shouldPropagate 是一个布尔值,取决于父链上的是否存在该事件的监听器以及,事件处理程序返回的值.他决定 $dispatch 是否停止冒泡 ...
- 高级C代码的汇编分析
在windows上,常用的函数调用方式有: Pascal方式,WINAPI(_stdcall)方式 和C方式(_cdecl) _cdecl调用规则: 1,参数从右到左入堆栈 2,在函数返回后,调用者要 ...
- java生成唯一的id编号
GUID是一个128位长的数字,一般用16进制表示.算法的核心思想是结合机器的网卡.当地时间.一个随即数来生成GUID.从理论上讲,如果一台机器每秒产生10000000个GUID,则可以保证(概率意义 ...
- Python 装饰器和抽象类
#装饰器:对类或者函数进行功能的扩展 ''' #第一步:基本函数 def la(): print('脚踏黄河两岸,手拿机密文件,前面机枪扫射,后面炮火连天') #调用函数 la() la() #第二步 ...
- Android:Google出品的序列化神器Protocol Buffer使用攻略
习惯用 Json.XML 数据存储格式的你们,相信大多都没听过Protocol Buffer Protocol Buffer 其实 是 Google出品的一种轻量 & 高效的结构化数据存储格式 ...
- 如何加快JavaScript的加载与执行
JS 有个很无语的阻塞特性,就是当浏览器在执行JS 代码时,不能同时做其他任何事情,无论其代码是内嵌的还是外部的. 浏览器在碰到一个引入外部JS 文件的<script>标签时会停下所有工作 ...