zoukankan      html  css  js  c++  java
  • 返回顶部按钮功能的实现

    <!DOCTYPE html>
    <html lang="en">
    <head>
        <meta charset="UTF-8">
        <title>toTop</title>
    <style type="text/css">
    *{
        margin:0;
        padding: 0;
    }
    html{
        height: 100%;
    }
    .toTopBtn{
        position: fixed;
        bottom: 100px;
        right: 100px;
        background: #333;
        color: #fff;
        padding: 5px 10px;
        cursor: pointer;
        display: none;
    }
    </style>
    </head>
    <body>
        <p>kkk</p><p>kkk</p><p>kkk</p><p>kkk</p><p>kkk</p><p>kkk</p><p>kkk</p><p>kkk</p><p>kkk</p><p>kkk</p><p>kkk</p><p>kkk</p><p>kkk</p><p>kkk</p><p>kkk</p><p>kkk</p><p>kkk</p><p>kkk</p><p>kkk</p><p>kkk</p><p>kkk</p><p>kkk</p><p>kkk</p><p>kkk</p><p>kkk</p><p>kkk</p><p>kkk</p><p>kkk</p><p>kkk</p><p>kkk</p><p>kkk</p><p>kkk</p><p>kkk</p><p>kkk</p><p>kkk</p><p>kkk</p><p>kkk</p><p>kkk</p><p>kkk</p><p>kkk</p><p>kkk</p><p>kkk</p><p>kkk</p><p>kkk</p><p>kkk</p><p>kkk</p><p>kkk</p><p>kkk</p><p>kkk</p><p>kkk</p><p>kkk</p><p>kkk</p><p>kkk</p><p>kkk</p><p>kkk</p><p>kkk</p><p>kkk</p><p>kkk</p><p>kkk</p><p>kkk</p><p>kkk</p><p>kkk</p><p>kkk</p><p>kkk</p><p>kkk</p><p>kkk</p><p>kkk</p><p>kkk</p><p>kkk</p><p>kkk</p><p>kkk</p><p>kkk</p><p>kkk</p><p>kkk</p><p>kkk</p><p>kkk</p><p>kkk</p><p>kkk</p><p>kkk</p><p>kkk</p><p>kkk</p><p>kkk</p><p>kkk</p><p>kkk</p><p>kkk</p><p>kkk</p><p>kkk</p><p>kkk</p><p>kkk</p><p>kkk</p><p>kkk</p><p>kkk</p><p>kkk</p><p>kkk</p><p>kkk</p><p>kkk</p><p>kkk</p><p>kkk</p><p>kkk</p><p>kkk</p><p>kkk</p><p>kkk</p><p>kkk</p><p>kkk</p><p>kkk</p><p>kkk</p><p>kkk</p><p>kkk</p><p>kkk</p><p>kkk</p><p>kkk</p><p>kkk</p><p>kkk</p><p>kkk</p><p>kkk</p><p>kkk</p><p>kkk</p><p>kkk</p><p>kkk</p><p>kkk</p><p>kkk</p>
    <script type="text/javascript" src="http://vscss.com/dm/jquery.js"></script>
    <script type="text/javascript">
    $(function(){
        var toTop = $("<span class='toTopBtn'>返回顶部</span>");
        $('body').append(toTop);
        $(window).scroll(function(event) {
            if($(window).scrollTop()>100){
                $('.toTopBtn').fadeIn();
            }else{
                $('.toTopBtn').fadeOut();
            }
        });
        $('.toTopBtn').click(function(){
            $('html,body').animate({
                scrollTop:0
            },200);
            //return false;
        });
    });
    </script>
    </body>
    </html>
  • 相关阅读:
    P3391 【模板】文艺平衡树(Splay)
    P4198 楼房重建
    P1491 集合位置
    P3957 跳房子
    P4016 负载平衡问题
    bzoj1077: [SCOI2008]天平 差分约束
    bzoj1151: [CTSC2007]动物园zoo 状压dp
    bzoj1076: [SCOI2008]奖励关 状压dp
    bzoj1226: [SDOI2009]学校食堂Dining 状压dp
    bzoj1879: [Sdoi2009]Bill的挑战 状压dp
  • 原文地址:https://www.cnblogs.com/vscss/p/5924363.html
Copyright © 2011-2022 走看看