日期:2014-05-16  浏览次数:20309 次

请问滚动条 滚动到一定位置 调用函数怎么实现的
我只知道滚动条事件是onscroll;

许多 博客 空间 类型的网站都有这种效果。
就是滚动条向下滚动到一定位置,出现返回顶部的框框。不滚动到大于指定的位置是不会出现的。 
这个该如何实现,忘高手赐教,我想了很久也想不出实现的方法。

PS:纯javascript实现,我没学jquery,谢谢。

------解决方案--------------------
HTML code
<!DOCTYPE html PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN" "http://www.w3.org/TR/html4/loose.dtd">
<html>
<head>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8">
<title>scroll事件监听</title>
<script type="text/javascript">
function gotop()
{
     var y= document.documentElement?(document.documentElement.scrollTop || 0):(document.body.scrollTop || 0);
     y = Math.max(y, (window.scrollY || 0));
     var o=document.getElementById("gotop"); 
    if(y>677)
    {
        var left=document.body.clientWidth-parseInt(o.style.width)-10;
        var top=document.body.offsetHeight-parseInt(y)/2-10;
        o.style.left=left+'px';
        o.style.top=top+'px';
        o.style.display='block';
    }else{o.style.display='none';}

}
window.attachEvent?window.attachEvent("onscroll",gotop):window.addEventListener("scroll",gotop,false);
</script>
</head>
<body>
<div style="height:677px;border:1px solid #bfbfbf;"></div>
<div style="height:677px;border:1px solid #bfbfbf;"></div>
<div id="gotop" style=" position:absolute; display:none;width:65px;height:25px;line-height:25px;"><a href="javascript:window.scrollTo(0,0);">回到顶部</a></div>
</body>
</html>