zoukankan      html  css  js  c++  java
  • 解决IE6不支持position:fixed属性

    最近在优化网站浮动广告时候遇见了IE6不支持position:fixed属性。上网收集了一下解决方案

    比较好的方案就是利用css表达式进行解决

    补充:CSS Expression (CSS 表达式),是一种使用动态设置 CSS 属性的方式,并且被 IE5 以上的版本所支持,但是 IE8 的标准模式已不再支持 CSS 表达式了

    IE7和以上的浏览器都支持position:fixed;

    之前写过一篇介绍过固定页脚的文字,那时候没在ie6下测试

    方法一

    <!--[if IE 6]>
    <style type="text/css">
    html{overflow:hidden}body{height:100%;overflow:auto;}
    #gs{position:absolute}
    </style>
    <![endif]-->

    优点:比较简单,方便!就针对IE6的hack

    缺点:一个页面只能有一个元素是position:absolute 不然所有设置absolute的元素都会浮动

    方法二 利用css表达式–固定底部

    _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)));

    优点:很好的兼容ie6

    确定:css也比较耗性能,但是比用js写法要好一点

    补充:解决ie6下振动bug

    * html,* html body {background-image:url(about:blank);background-attachment:fixed;}
  • 相关阅读:
    vue-cli
    使用git push命令如何忽略不想提交的文件夹或者文件
    Ajax实现的城市二级联动三
    Ajax实现的城市二级联动二
    Ajax实现的城市二级联动一
    DOM之城市二级联动
    如何把SVG小图片转换为 html字体图表
    vue权威指南笔记01——样式的设置
    2018年前端年末小结
    Array常用方法总结
  • 原文地址:https://www.cnblogs.com/wuwenjie/p/5618249.html
Copyright © 2011-2022 走看看