返回顶部的jquery代码jquery

/ / 2023-07-26   阅读:2494
返回顶部的jquery代码...

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>


我要评论

昵称:
验证码:

最新评论

共0条 共0页 10条/页 首页 上一页 下一页 尾页
意见反馈