请教滚动条 滚动到一定位置 调用函数如何实现的
日期：2014-05-16 浏览次数：20389 次
请问滚动条 滚动到一定位置 调用函数怎么实现的
我只知道滚动条事件是onscroll;
许多 博客 空间 类型的网站都有这种效果。
就是滚动条向下滚动到一定位置，出现返回顶部的框框。不滚动到大于指定的位置是不会出现的。
这个该如何实现，忘高手赐教，我想了很久也想不出实现的方法。
PS：纯javascript实现，我没学jquery，谢谢。
------解决方案--------------------
我只知道滚动条事件是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>
免责声明： 本文仅代表作者个人观点，与爱易网无关。其原创性以及文中陈述文字和内容未经本站证实，对本文以及其中全部或者部分内容、文字的真实性、完整性、及时性本站不作任何保证或承诺，请读者仅作参考，并请自行核实相关内容。
