简单的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是我们速度可以修改，看大家的需求。

[v_error]$(‘body,tml’).animate({这里的tml记得修改成html,因为小编再用HTML的时候再前端会显示本博的其他链接页面，所以大家一定要即可修改，否则可能导致不能使用。[/v_error]