hlrlqy 发表于 2015-9-13 19:22

Javascript DIV从固定位置置顶(高兼容)

最近建网站,基础不好,很多代码都是上网找的,但是实现这个功能的不是兼容性差就是繁琐至极,功夫不负有心人,让我找到了这个超简单超兼容的代码<script type="text/javascript">
var IO=document.getElementById('DIV名称'),Y=IO,H=0,IE6;
IE6=window.ActiveXObject&&!window.XMLHttpRequest;
while(Y){H+=Y.offsetTop;Y=Y.offsetParent};
if(IE6)
    IO.style.cssText="opacity: 0.85;position:absolute;top:expression(this.fix?(document"+
      ".documentElement.scrollTop-(this.javascript||"+H+")):0)";
window.onscroll=function (){
    var d=document,s=Math.max(d.documentElement.scrollTop,document.body.scrollTop);
    if(s>H&&IO.fix||s<=H&&!IO.fix)return;
    if(!IE6)IO.style.position=IO.fix?"":"fixed";      
    IO.fix=!IO.fix;
};
try{document.execCommand("BackgroundImageCache",false,true)}catch(e){};
//]]>
            
</script>
这段代码的功能(以论坛示范)
注意导航条。



拖动滚动条,导航条在最上面时变固定住了


神奇吧,而其他的方法代码要好几十行,兼容性还低


aaab 发表于 2015-9-13 19:23

绝对定位。。。。

hlrlqy 发表于 2015-9-13 19:25

aaab 发表于 2015-9-13 19:23
绝对定位。。。。

IE6是不支持的,而且这段代码是DIV到固定位置才置顶

2909094965 发表于 2015-9-13 20:33

谢谢分享

kenvan 发表于 2015-9-13 21:26

用了效果还不错!
页: [1]
查看完整版本: Javascript DIV从固定位置置顶(高兼容)