返回顶部 jq 效果

HTML

<div class="toTop_l">top</div>

CSS

.toTop_l{
  width:50px;
  height:50px;
  text-align:center;
  text-transform:uppercase;
  position: fixed;
  bottom:100px;
  right: 10px;
  background:rgba(0,0,0,0.5);
  color:#fff;
  font-size:14px;
  line-height: 50px;
  border:2px solid #fff;
  cursor:pointer;
  transition:all 1s;
}
.toTop_l:hover{
  color:#000;
  background:#fff;
  border:2px solid #000;
}

JS

<script>
$(function(){
			$(".toTop_1").hide();
			$(window).scroll(function(){
				if ($(window).scrollTop() > 100) {
					$(".toTop_l").fadeIn(1000);
				} else {
					$(".toTop_l").fadeOut(1000);
				};
			});
			$(".toTop_l").click(function(){
				$('body,html').animate({scrollTop:'0'},1000);
				return false;
			});
});
</script>