这段代码测试了没有bug
<!DOCTYPE html>
<html>
<head lang="en">
<meta charset="UTF-8">
<title></title>
</head>
<style type="text/css">
.main{width:100%; height:3000px; background:#ccc;}
.toTop{background:#fff; width:100px; height:100px; position:fixed; right:0; bottom:50%;}
</style>
<body>
<div class="main"></div>
<div class="toTop">
<a href="javascript:void(0)" onclick="ding()">走起</a>
</div>
</body>
<script type="text/javascript">
var timer;
var lock=1;
function setPageScrollTop(value){
var a=window.navigator.userAgent;
var z=a.toLowerCase();
var b=z.indexOf('safari');
if(b!=-1){
document.body.scrollTop=value;
}else{
document.documentElement.scrollTop=value;
}
}
function getPageScrollTop(){
var zhi=0;
var a=window.navigator.userAgent;
var z=a.toLowerCase();
var b=z.indexOf('safari');
if(b!=-1){
zhi=document.body.scrollTop;
}else{
zhi=document.documentElement.scrollTop;
}
return zhi;
}
function detail(mu){
var dang=getPageScrollTop();
if(dang>=mu){
dang-=50;
if(dang<=mu){
dang=mu;
window.clearInterval(timer);
lock=1;
}
}else if(dang<mu){
dang+=50;
if(dang>=mu){
dang=mu;
window.clearInterval(timer);
lock=1;
}
}else{}
setPageScrollTop(dang);
}
function ding(){
var mu=1000;
if(lock==1){
lock=0;
timer=window.setInterval(function(){
detail(mu)
},30);
}
}
</script>
</html>
给它稍微变形了一下,就出BUG了,当滚筒条在上面的时候,点击滚动条往下走,然后用鼠标拉着滚动条往下走的时候就走不动了 出现了BUG
<!DOCTYPE html>
<html>
<head lang="en">
<meta charset="UTF-8">
<title></title>
</head>
<style type="text/css">
*{padding:0; margin:0;}
.main{width:100%; height:3000px; background:#ccc;}
.toTop{background:#fff; width:100px; height:100px; position:fixed; right:0; bottom:50%;}
</style>
<body>
<div class="main"></div>
<div class="toTop">
<a href="javascript:void(0)" onclick="ding()">走起</a>
</div>
</body>
<script type="text/javascript">
var timer;
var lock=1;
function setPageScrollTop(value){
var a=window.navigator.userAgent;
var z=a.toLowerCase();
var b=z.indexOf('safari');
if(b!=-1){
document.body.scrollTop=value;
}else{
document.documentElement.scrollTop=value;
}
}
function getPageScrollTop(){
var zhi=0;
var a=window.navigator.userAgent;
var z=a.toLowerCase();
var b=z.indexOf('safari');
if(b!=-1){
zhi=document.body.scrollTop;
}else{
zhi=document.documentElement.scrollTop;
}
return zhi;
}
function detail(mu){
var dang=getPageScrollTop();
if(dang>=mu){
var speed=Math.ceil((dang-mu)/4);
dang=dang-speed;
if(dang<=mu){
dang=mu;
window.clearInterval(timer);
lock=1;
}
}else if(dang<mu){
var speed=Math.ceil((mu-dang)/4);
dang=dang+speed;
if(dang>=mu){
dang=mu;
window.clearInterval(timer);
lock=1;
}
}else{}
setPageScrollTop(dang);
}
function ding(){
var mu=1000;
if(lock==1){
lock=0;
timer=window.setInterval(function(){
detail(mu)
},50);
}
}
</script>
</html>
找不到问题出在哪了,很郁闷
求解,很感谢大家