实现原理：
利用a标签回到顶部的链接， href=”javascript:;”是用来阻止a标签的默认行为。
html代码
<a href="javascript:;" id="return_top" title="回到顶部">返回顶部</a>
css代码（始终固定在屏幕右下角）
#return_top{ width:40px; height:40px; position:fixed; right:25px; bottom:10px; display:none; background-color: #FFFFFF; }
js代码
<script type="text/javascript"> // 回到顶部效果 window.onload = function(){ var obtn = document.getElementById('return_top'); //获取回到顶部按钮的ID var clientHeight = document.documentElement.clientHeight; //获取可视区域的高度 var timer = null; //定义一个定时器 var isTop = true; //定义一个布尔值，用于判断是否到达顶部 window.onscroll = function(){ //滚动条滚动事件 //获取滚动条的滚动高度 var osTop = document.documentElement.scrollTop || document.body.scrollTop; if(osTop >= clientHeight){ //如果滚动高度大于可视区域高度，则显示回到顶部按钮 obtn.style.display = 'block'; }else{ //否则隐藏 obtn.style.display = 'none'; } //主要用于判断当 点击回到顶部按钮后 滚动条在回滚过程中，若手动滚动滚动条，则清除定时器 if(!isTop){ clearInterval(timer); } isTop = false; } obtn.onclick = function(){ //回到顶部按钮点击事件 //设置一个定时器 timer = setInterval(function(){ //获取滚动条的滚动高度 var osTop = document.documentElement.scrollTop || document.body.scrollTop; //用于设置速度差，产生缓动的效果 var speed = Math.floor(-osTop / 6); document.documentElement.scrollTop = document.body.scrollTop = osTop + speed; isTop =true; //用于阻止滚动事件清除定时器 if(osTop == 0){ clearInterval(timer); } },30); } } </script>
微信小程序搜：红旗头像制作
