js,javascript,jquery网页返回顶部代码

最新推荐文章于 2022-10-10 17:01:41 发布

rin9958

最新推荐文章于 2022-10-10 17:01:41 发布

阅读量370

点赞数

示意图：右下角

<style>
.top {position: fixed;display: none;width: 55px;height: 55px;right: 50px;bottom: 50px;
background: #D6D6D6;color: #fff;font-size: 36px;line-height: 55px;text-align: center;
cursor: pointer;border-radius: 40px;transition-property: background;transition-duration: 0.5s;
-webkit-transition-property: background;-webkit-transition-duration: 0.5s;-moz-transition-property: background;
-moz-transition-duration: 0.5s;
}
</style>
<div class="top" style="display: block;">↑
</div>
<script type="text/javascript">
$(document).ready(function(){
$(window).scroll(function(){
if($(this).scrollTop()>100){
$('.top').fadeIn();}
else{
$('.top').fadeOut();} });
$('.top').click(function(){
$('body,html').animate({scrollTop:0},800);});
});

</script>

转载自:http://www.9958.pw/post/js_back_top