微信8.0 浏览器不支持position:fixedFeb
anlondon Lv6
  2021-03-07 20:37:00 2021-03-07 20:37   2023-07-05 22:01:00    

问题

修改一个页面，需要用到 position：fixed ,但是该属性在 微信8.0 的浏览器中并不能正常生效

解决

有网友说，可以参考 IE6 中处理 position：fixed 不生效的处理方法。

ie6 垂直居中固定定位，代码如下：

1
2
3
4
5
6
7
8
9
#center {
  _position:absolute;
  _top:expression(eval(document.compatMode && document.compatMode=='CSS1Compat') ? documentElement.scrollTop + (document.documentElement.clientHeight-this.offsetHeight)/2 :/*IE6*/document.body.scrollTop + (document.body.clientHeight - this.clientHeight)/2);/*IE5 IE5.5*/
}

*html{
   background-image:url(about:blank);
   background-attachment:fixed;
 }

ie6 底部固定定位，代码如下：

1
2
3
4
5
6
7
8
9
10
#bottom {
  _position: absolute;
  _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)));
}

*html{
   background-image:url(about:blank);
   background-attachment:fixed;
 }

ie6 头部固定定位，代码如下：

1
2
3
4
5
6
7
8
9
10
#top {
  _position: absolute;
  _bottom: auto;
  _top: expression(eval(document.documentElement.scrollTop));
}

*html{
   background-image:url(about:blank);
   background-attachment:fixed;
 }

相关资料:

 Comments
  1. 1. 问题
  2. 2. 解决
    1. 2.0.1. ie6 垂直居中固定定位，代码如下：
    2. 2.0.2. ie6 底部固定定位，代码如下：
    3. 2.0.3. ie6 头部固定定位，代码如下：