HTML :
<input id="btn1" type="button" value="回到顶部" />
CSS :
#btn1{position:fixed;bottom:10px;right:10px;}
JS :
window.onload=funcition(){ var oBtn=document.getElementById("btn"); var timer=null; //申明一个变量看是否为系统还是用户滚动 var sBys=true; window.onscroll=funcition(){ if(!sBys){ clearInterval(timer); } sBys=false; } oBtn.onclick=funcition(){ timer = setInterval(funcition(){ //获取scrollTop var scrollTop=document.documentElement.scrollTop||document.body.scrollTop; //当点击按钮回到顶部时计算缓冲速度 var ispeed=Math.floor(-scrollTop/8); if(scrollTop==0){ clearInterval(timer) } sBys=true; document.documentElement.scrollTop=document.body.scrollTop=scrollTop+ispeed; },30) } }
Points de connaissances :
1. La vitesse de calcul (buffering) est arrondie à l'inférieur
2. Lorsque scrollTop==0, la minuterie doit être effacée
3. Il est nécessaire de déterminer si l'utilisateur ou js actionne la barre de défilement. S'il s'agit d'une opération utilisateur, effacez le minuteur
Ce qui précède représente l’intégralité du contenu de cet article, j’espère que vous l’aimerez tous.