悬浮固定在右下角，会自动隐藏，兼容ie6

最新推荐文章于 2020-01-15 17:32:06 发布

飞鸟flyboy

最新推荐文章于 2020-01-15 17:32:06 发布

阅读量416

点赞数

分类专栏： html

本文链接：https://blog.csdn.net/a5251199/article/details/49796559

版权

html 专栏收录该内容

24 篇文章 0 订阅

订阅专栏

<title>弹性返回顶部JS代码_懒人图库</title>
<SCRIPT type=text/javascript >
// JavaScript Document
function goTopEx(){
        var obj=document.getElementById("goTopBtn");
        alert(document.documentElement.clientHeight);
        function getScrollTop(){
                return document.documentElement.scrollTop;
            }
        function setScrollTop(value){
                document.documentElement.scrollTop=value;
            }
        window.οnscrοll=function(){getScrollTop()>0?shows():obj.style.display="none";}

          function shows(){
              obj.style.display="";
          // check is IE6
          if(!window.XMLHttpRequest){
              obj.style.position ="absolute";
              obj.style.top = ((document.documentElement.scrollTop+document.documentElement.clientHeight-40))+"px";

              obj.style.left = (document.documentElement.scrollLeft + document.documentElement.clientWidth-50 )+"px";
              }
        }

        obj.οnclick=function(){
            var goTop=setInterval(scrollMove,10);
            function scrollMove(){
                    setScrollTop(getScrollTop()/1.1);
                    if(getScrollTop()<1)clearInterval(goTop);
                }
        }
    }

</SCRIPT>
<STYLE>
BODY {
    HEIGHT: 3600px;
}
#goTopBtn {
    POSITION: fixed; TEXT-ALIGN: center; LINE-HEIGHT: 30px; WIDTH: 30px; BOTTOM: 35px; HEIGHT: 33px; FONT-SIZE: 12px; CURSOR: pointer; RIGHT: 0px; _position: absolute; _right: auto
}
</STYLE>

</head>

<body style="text-align:center">

<DIV style="DISPLAY: none" id=goTopBtn><IMG border=0 src="images/lanren_top.jpg"></DIV>
<SCRIPT type=text/javascript>goTopEx();</SCRIPT>

<br /><br /><br /><br /><br /><br /><br />1111111111111111111111111111111111111111
<p>来源：<a href="http://www.thinkzm.com/" target="_blank">Redm赤美广告</a>　代码整理：<a href="http://www.lanrentuku.com/" target="_blank">懒人图库（西西）</a>　感谢：<a href="http://www.nifengla.com/" target="_blank">你疯啦</a></p>
<p>＊尊重他人劳动成果，转载请自觉注明出处！注：此代码仅供学习交流，请勿用于商业用途。</p>
<p></p>
<p><p>超出首屏范围，即会出现TOP按钮，否则自动隐藏。<br />
 </p></p>
<p></p>
</body>
</html>