position:fixed的兼容方案

作者: Lo阿飞ve | 来源:发表于2018-06-13 20:58 被阅读0次

大家都知道，固定定位对于低版本浏览器不兼容，如何解决，看下边方案。

 <style>
           *{
            margin:0;
            padding:0;
           }
        .box{
            width:200px;
            height:200px;
            background:red;
            position:absolute;
            right:0;
            bottom:0;
        }
          body{
            height:2000px;
          }
    </style>

  <body>
    <div class="box">
    </div>
</body>

 <script>
     var box = document.getElementsByClassName('box')[0]; 
           window.onload = window.onscroll = function () { 
        var sct = document.documentElement.scrollTop || document.body.scrollTop;     
        box.style.top = sct-box.offsetHeight+document.documentElement.clientHeight+'px'
     
     }
</script>