zoukankan      html  css  js  c++  java
  • 返回顶部

    小知识:

    $(window).scrollTop()---获取当前滚轮滑动的值

    $(window).scrollTop(0)----括号中为0则为回到顶部

    代码示例:

    <!DOCTYPE html>
    <html lang="en">
    <head>
    <meta charset="UTF-8">
    <title>Title</title>
    <style>
    .hide{
    display:none;
    }
    .returnTop{
    height: 60px;
    100px;
    background-color: darkgray;
    position: fixed;
    right: 0;
    bottom: 0;
    color: greenyellow;
    line-height: 60px;
    text-align: center;
    </style>
    </head>
    <body>
    <div class="div1 div">
    <p>hello</p>
    <p>hello</p>
    <p>hello</p>
    <p>hello</p>
    <p>hello</p>
    <p>hello</p>
    <p>hello</p>
    <p>hello</p>
    <p>hello</p>
    <p>hello</p>
    <p>hello</p>
    <p>hello</p>
    <p>hello</p>
    <p>hello</p>
    <p>hello</p>
    <p>hello</p>
    <p>hello</p>
    <p>hello</p>

    </div>
    <div class="div2 div"></div>
    <div class="div3 div"></div>
    <div class="returnTop hide" onclick="returnTop();">返回顶部</div>
    <script src="jquery-3.2.1.js"></script>
    <script>
    // 点击事件
    function returnTop() {

    $(window).scrollTop(0)
    }


    //滚轮事件
    window.onscroll=function () {
    var current=$(window).scrollTop();
    if(current>10){
    $('.returnTop').removeClass('hide')
    }else{
    $('.returnTop').addClass('hide')
    }
    }

    </script>
    </body>
    </html>
    Java学习内容
  • 相关阅读:
    PHP创建socket服务
    linux配置PS1
    几个常用的linux命令
    MongoDB的分片集群搭建
    django-admin 配置
    django使用mysql数据库
    Django知识
    docker 监控之 cadvisor
    shell 拾遗
    shell 基数数值方法
  • 原文地址:https://www.cnblogs.com/wangtc/p/10576258.html
Copyright © 2011-2022 走看看