学习笔记：《BOM》回到头部

 

 

<!doctype html>
<html>
<head>
<meta charset="utf-8">
<title>回到头部</title>
<style type="text/css">
body { height:5000px; }
#gotop { width:50px; height:50px; display:block; background:#666; position:fixed; right:5px; bottom:20px; }
</style>
</head>

<body>



<a href="javascript:;" id="gotop"></a>


<script type="text/javascript">
window.onload = function()
{
    var gotop =document.getElementById("gotop");
    var timer = null;
    var sys = true;
    
    window.onscroll = function()
    {
        if(!sys) { clearInterval(timer); }
        sys = false;
    }
    gotop.onclick = function()
    {        
        function move()
        {
            var scrollTop = document.documentElement.scrollTop || document.body.scrollTop;
            var speed = Math.floor(-scrollTop/10);
            if(scrollTop == 0) { clearInterval(timer); }
            sys = true;
            document.documentElement.scrollTop = document.body.scrollTop = scrollTop + speed;
        }
        timer = setInterval(move,30);
    }
    
}
</script>




</body>
</html>

 

 

 

 

 

posted @ 2012-09-05 23:44  赵小磊  阅读(203)  评论(0)    收藏  举报
回到头部