简单的js网站按钮缓冲置顶特效滚动返回顶部代码实例

简单的js慢速滚动返回顶部代码实例

HTML代码：

<! ---可这是图片或文字--->
<div class="top">
    <a href=""><img src="./images/top.png"></a>
</div>

css：

/*top*/
.top{
    width:60px;
    height: 60px;
    position: fixed;
    right:20px;
    bottom:100px;
    display: none;
}

JS代码如下：

  /////top
  $(window).scroll(function(){
	  if($(window).scrollTop()>800){
		  $('.top').css('display','block')
	  }else{
		  $('.top').css('display','none')
	  }
  })
  
  $('.top').click(function(){
	  
	  $('body,tml').animate({
		scrollTop:0  
	  },500)
	  
  })
  
  
});

ps：注意 if($(window).scrollTop()>800)这句话的意思是当浏览器到一定的高度的时候显示图标，否则隐藏。500是我们速度可以修改，看大家的需求。