ie 6 position fixed
IE6position:fixed问题解决方案
2013-11-06 18:25:04| 分类: JS/CSS | 标签:ie6 fixed |举报 |字号大中小订阅
普通写法
#top{
position:fixed;
bottom:0;
right:20px;
}
IE6中写法
#top{
position:fixed;
_position:absolute;
bottom:0;
right:20px;
_bottom:auto;
_top:expression(eval(document.documentElement.scrollTop+document.documentElement.clientHeight-this.offsetHeight-(parseInt(this.currentStyle.marginTop,10)||0)-(parseInt(this.currentStyle.marginBottom,10)||0)));
}
不慌,到这里没完,IE6中position:fixed还有一个拖动滚动条的时候闪动的问题,解决方案如下:
IE6中position:fixed闪动
*html{
background-image:url(about:blank);
background-attachment:fixed;
}
JS的解决方案
JS是我最不愿使用的解决方案,因为这种纯样式的bug用JS来解决有点大材小用,而且JS需要DOM载入后才执行,有可能会出现闪屏的现象.
JS的解决方案很简单,通过设置一个top来实现,top是指分页的上边距离document的上边的长度,可以被分解成下面几项(并不是完整的代码)
top = scrollTop + clientHeight - height(分页的高度)
scrollTop和clientHeight分别用来解决上面两个问题,滚动条的滚动会影响到scrollTop,而窗口的变化会影响到clientHeight,所以当这两个事件被触发时必须重置top,于是就形成类似下面的代码,但这段脚本的刷新率会非常高,估计有性能问题.
window.onresize = window.onscroll = function(){
//reset top
};
ie 6 position fixed的更多相关文章
- CSS:position:fixed使用(转)
position属性规定元素的定位类型,即建立元素布局所用的定位机制.任何元素都可以定位,不过绝对定位或固定定位元素会生成一个块级框,而不论该元素本身是什么类型.相对定位元素会相对于它在正常流中的默认 ...
- position:fixed和scroll实现div浮动【示例】
前言 在自己建站的过程中,要实现一个div随滚动条浮动的效果,网上找了些示例不太好用,还是自己动手,丰衣足食,写的不好请大家谅解,毕竟我不是搞前端的,因为自己建站毕竟每一步都必须自己来,这边只是做个记 ...
- 修正IE6不支持position:fixed的bug(转)
众所周知IE6不支持position:fixed,这个bug与IE6的双倍margin和不支持PNG透明等bug一样臭名昭著.前些天我做自己的博客模板的时候,遇到了这个问题.当时就简单的无视了IE6— ...
- position:fixed失效
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/ ...
- 解决IE6不支持position:fixed的bug
/*完整代码 */ /* 除IE6浏览器的通用方法 */ .ie6fixedTL { position: fixed; left:; top:; } .ie6fixedBR { position: f ...
- 解决 scroll() position:fixed 抖动、导航菜单固定头部(底部)跟随屏幕滚动
一.导航栏或者页脚正常情况下固定在页面的相应位置,当页面滚动后,导航栏或者页脚固定在页面的顶部或者底部的情景 一般就是将该块的代码样式的position设置为fixed.固定在顶部的话,将top设置为 ...
- 通过定位position="fixed"实现网页内容的固定层效果
在网页的顶部或者底部导航栏中经常需要使用到固定层的效果,即紧挨浏览器窗口的顶部或底部而网页其他内容的影响. 一.实现 主要通过设置导航栏元素的位置属性position="fixed" ...
- 完美解决IE6不支持position:fixed的bug
示例代码: <!DOCTYPE html><html><head><meta http-equiv="Content-Type" cont ...
- 元素设置position:fixed属性后IE下宽度无法100%延伸
元素设置position:fixed属性后IE下宽度无法100%延伸 IE bug 出现条件: 1.div1设置position:fixed属性,并且想要width:100%的效果. 2.div2(下 ...
- 【转】ie8 不支持 position:fixed 的简单解决办法
今天发现使用 position:fixed 的页面在firefox下没有问题,在IE8下却不能正常显示,在网上找了找,有不少相关文章,但是不是不起作用就是太复杂,后来终于发现一个简单的解决办法,就是在 ...
随机推荐
- RenderPartial RenderAction Partial Action
MVC Razor中有不同的展现partial view的方法,许多开发人员子在选择使用 RenderPartial or RenderAction or Partial or Action help ...
- Bitmap 与ImageSource之间的转换
public class ImageConverter { [DllImport("gdi32.dll", SetLastError = true)] private static ...
- QObject就有eventFilter,功能很强(随心所欲的进行处理,比如用来QLineEdit分词)
相信大家都用过词典吧!因为英语不太好...O(∩_∩)O~,所以经常进行划词翻译! 简述 实现 效果 源码 更多参考 实现 原理:鼠标移至某单词之上,获取鼠标位置,然后在对应位置进行取词,翻译! 基于 ...
- Qt Project的持续集成方案
作者:齐亮链接:http://www.zhihu.com/question/24314354/answer/27547787来源:知乎著作权归作者所有,转载请联系作者获得授权. PETER HARTM ...
- QT自定义窗口(模拟MainWindow)
在这里自定义窗口是通过继承于QFrame,内部分为上下两部分,上半部分就是标题栏,下面是窗口的具体内容.上下两部分通过布局固定位置.最后窗口的各种鼠标拖动,缩放,等操作通过添加鼠标事件来完成一个窗口的 ...
- Silverlight 结合ArcGis
原文 http://www.dotblogs.com.tw/justforgood/archive/2012/05/09/72064.aspx 终于有机会谈到ArcGis(觉得很冷门) ,不过既然都做 ...
- UESTC_Little Deer and Blue Cat CDOJ 1025
In DOTA, there are two Intellegence heroes. One is Enchantress, who is usually called Little Deer by ...
- Path Sum 解答
Question Given a binary tree and a sum, determine if the tree has a root-to-leaf path such that addi ...
- Impala 3、Impala、Hbase整合
Impala可以通过Hive外部表方式和HBase进行整合,步骤如下: • 步骤1:创建hbase 表,向表中添加数据 create 'test_info', 'info' put 'test_inf ...
- poj 2723 Get Luffy Out(2-sat)
Description Ratish is a young man who always dreams of being a hero. One day his friend Luffy was ca ...