资讯专栏INFORMATION COLUMN

简单版—返回顶部

Fourierr / 2508人阅读

摘要:页面右下角返回顶部页面右下角返回顶部关于我们意见反馈滚动事件全局页面中间内容高度头部和底部总高为

页面右下角返回顶部

html




css


.sriLink{
    position: fixed;
    right: 50%;
    margin-right: -665px;
    bottom: 90px;
    z-index: 100;
}
.sriLink a{
    display: block;
    width: 50px;
    height: 50px;
    background: #eceded;
    text-align: center;
    padding-top: 8px;
    color: white;
    border-radius: 3px;
    margin-top: 5px;
    line-height: 16px;
}
.sriLink .back_top a {
    background: #e4e4e4 url(../image/back_top.png) no-repeat center;
}

js


/*滚动事件*/
window.addEventListener("scroll",function(e){
    var t = document.documentElement.scrollTop || document.body.scrollTop;
    if(t > 400 ){
        $(".back_top").show();
    }else{
        $(".back_top").hide();
    }
})
/*全局页面中间内容高度*/
$().ready(function(){
    var Height = $(window).height();
    var h = (Height - 212)+"px" //头部和底部总高为212
   $(".sriContainer").css("min-height",h);
})

文章版权归作者所有,未经允许请勿转载,若此文章存在违规行为,您可以联系管理员删除。

转载请注明本文地址:https://www.ucloud.cn/yun/2210.html

相关文章

  • TwinklingRefreshLayout 小而强大的刷新控件,自带顺滑的越界回弹,v1.04

    摘要:为了达到更好的显示效果,最好禁用系统的,如上给添加。头部固定高度在此高度上显示刷新状态底部高度设置最大的越界高度灵活的设置是否禁用上下拉。是否允许越界回弹。表示向上拉下拉释放时回调的状态。 TwinklingRefreshLayout v1.04 版精心重构,优化 UI、刷新及越界动画效果,修复众多 bug,完美发布!TwinklingRefreshLayout延伸了Google的Sw...

    2501207950 评论0 收藏0
  • TwinklingRefreshLayout 小而强大的刷新控件,自带顺滑的越界回弹,v1.04

    摘要:为了达到更好的显示效果,最好禁用系统的,如上给添加。头部固定高度在此高度上显示刷新状态底部高度设置最大的越界高度灵活的设置是否禁用上下拉。是否允许越界回弹。表示向上拉下拉释放时回调的状态。 TwinklingRefreshLayout v1.04 版精心重构,优化 UI、刷新及越界动画效果,修复众多 bug,完美发布!TwinklingRefreshLayout延伸了Google的Sw...

    xioqua 评论0 收藏0
  • TwinklingRefreshLayout 小而强大的刷新控件,自带顺滑的越界回弹,v1.04

    摘要:为了达到更好的显示效果,最好禁用系统的,如上给添加。头部固定高度在此高度上显示刷新状态底部高度设置最大的越界高度灵活的设置是否禁用上下拉。是否允许越界回弹。表示向上拉下拉释放时回调的状态。 TwinklingRefreshLayout v1.04 版精心重构,优化 UI、刷新及越界动画效果,修复众多 bug,完美发布!TwinklingRefreshLayout延伸了Google的Sw...

    yuanzhanghu 评论0 收藏0
  • HTML+CSS+JAVASCRIPT 高仿低配网页网易云音乐播放器

    摘要:高仿低配网页版网易云音乐播放器前言没有使用任何框架,只是想用最简单纯的代码实现下前台后台是参考网上的例子写的,代码是在的基础上重新写的还有她的姊妹篇网易云音乐移动端,请查看这里写在前头的话鄙人野生前端一只,专业,自学前端已经一年多了 HTML+CSS+JAVASCRIPT 高仿低配网页版网易云音乐播放器 showImg(https://segmentfault.com/img/remo...

    RaoMeng 评论0 收藏0

发表评论

0条评论

Fourierr

|高级讲师

TA的文章

阅读更多
最新活动
阅读需要支付1元查看
<