网页素材

自适应页面向下滑动一定搞定后显示返回头部按钮

自适应页面向下滑动一定搞定后显示返回头部按钮
 <div class="backtop"><em></em></div>
/*回到顶部*/
.backtop{width: 50px;height: 50px;position: fixed;bottom: 120px;right: 100px;border:1px solid #efefef;cursor: pointer;background-color: #fff;text-align: center;}
.backtop:hover{background:#efefef}
.backtop em{width: 21px;height: 20px;bottom: 120px;background: url(img/top.png) no-repeat;cursor: pointer;display: inline-block;margin-top: 14px;}
@media (max-width:767px){
    .backtop{right:20px;}
}
$(window).scroll(function(){
    if ($(window).scrollTop()>50){//超过50显示
        $('.backtop').fadeIn(800);
    }
    else{
        $('.backtop').fadeOut(800);
    }
});
$(".backtop ").click(function(){
    $('body,html').animate({scrollTop:0},500);
    return false;
});

[声明]本站素材来自用户分享,仅限学习交流请勿用于商业用途。如损害你的权益请联系zhimatong@qq.com删除。

联系
顾问

交流群 购物车
账号登录

没有账号?立即注册

忘记密码

登录即同意用户协议没有账号? 立即注册
账号注册
我已阅读并同意用户协议
立即注册
注册即同意用户协议已有账号? 立即登录
找回密码

操作步骤:邮箱验证->设置新密码

注册即同意用户协议已有账号? 立即登录