• scrollTop()案例


    设置 <div> 元素中滚动条的垂直偏移:

    定义和用法

    scrollTop() 方法返回或设置匹配元素的滚动条的垂直位置。

    scroll top offset 指的是滚动条相对于其顶部的偏移。

    如果该方法未设置参数,则返回以像素计的相对滚动条顶部的偏移。

     1 <!DOCTYPE html>
     2 <html lang="en">
     3 <head>
     4     <meta charset="UTF-8">
     5     <title>Title</title>
     6     <style type="text/css">
     7         div{border: 1px solid gray;width: 200px;height: 200px;margin: 50px;overflow: auto}
     8     </style>
     9 </head>
    10 <body>
    11 <div>
    12     刚才看了黄小平先生的一篇短文,一个内心有光的人,永远不会有黑夜。是啊,每天凌晨起床,在灯光下走到窗前,外面漆黑一片,也曾经试着走出去,可以360度的仰望着天空,即使隔着厚厚的云层,也能感受到夜空的美丽斑斓,就像一粒种子在黑暗的牢笼里,用生根发芽的信念,残破自己的身体一点一点的向上攀爬,当她顶开地表的最后一条缝,光明开始记录她绽放的生命,不论是树活千年,还是花开数天,最初她们都经历过黑暗。人生也是这样,只要心里充满对光明的渴望,至少你是温暖的!许多小语——心里的光就是梦起飞的地方,飞行的过程就是目标中的理想!
    13 </div>
    14 <button class="settings">把scrollTop设置100px</button>
    15 <button class="gettop">获取当前scrollTop</button>
    16 <script type="text/javascript" src="js/jquery-1-8-3.js"></script>
    17 <script type="text/javascript">
    18 (function($){
    19     $(".settings").click(function(){
    20         $("div").scrollTop(100);
    21     });
    22     $(".gettop").click(function(){
    23         console.log($("div").scrollTop() + "px");
    24     });
    25     console.log($(".settings").offset());
    26 })(jQuery);
    27 </script>
    28 </body>
    29 </html>
  • 相关阅读:
    Brackets 前端编辑器试用
    java面试题之第一回
    java数据类型
    [转]JAVA标识符和关键字
    Servlet的几个关键知识点
    一个Servlet中可以有多个处理请求的方法
    基于java的聊天室/群发控制台程序
    java 创建string对象机制 字符串缓冲池 字符串拼接机制
    git 常用命令
    ajax axios 下载文件时如何获取进度条 process
  • 原文地址:https://www.cnblogs.com/liubeimeng/p/5848606.html
Copyright © 2020-2023  润新知