点页面侧边按钮进行js置顶
<div id="scroll" ><img src="按钮图片"></div>
<style type="text/css">
#scroll {
width: 62px;
height: 50px;
right: 10px;
bottom: 50px;
cursor: pointer;
position: fixed;
}
div#scroll img {
width: 40px;
height: 40px;
background: #4682b4;
padding: 2px;
border-radius: 2px;
}
</style>
<script>
var oBtn = document.getElementById('scroll');
oBtn.onclick = function () {
oBtn.style.backgroundPosition = '-199px -2px';
var scrollTop = document.documentElement.scrollTop || document.body.scrollTop;
/*ie chrome兼容 滚动条距离上方高度*/
var timer = setInterval(function () {
scrollTop -= 20;
window.scrollTo(0, scrollTop);
/*(x,y)*/
if (scrollTop <= 0) {/*滚动距离小于等于0 清除定时器*/
clearInterval(timer);
var timer1 = setTimeout(function () {
oBtn.style.backgroundPosition = '-22px -5px';
}, 1000);
}
}, 2);
}
</script>