• 点击图片箭头回到顶部案例


     1 <!DOCTYPE html>
     2 <html lang="en">
     3 <head>
     4     <meta charset="UTF-8">
     5     <title>02-jQuery-动态创建表格案例</title>
     6     <script src="jquery-1.11.3.js"></script>
     7     <style>
     8             .top{
     9                 position: fixed;
    10                 bottom: 40px;
    11                 right: 10px;
    12                 cursor:pointer;
    13 
    14             }
    15     </style>
    16     <script>
    17             $(function(){
    18                $('.top').on('click',function(){
    19                    $(window).scrollTop(0);
    20                    $(window).scrollLeft(0);
    21                });
    22                $('#J_Box').on('click','h1',function(){
    23                    this.innerHTML+='-';
    24                    $(this).text($(this).text()+1);
    25                })
    26             })
    27     </script>
    28 <body>
    29 <div class="top" id="top">
    30     <img src="imgs/bk-top3.jpg" alt="">
    31 </div>
    32 <div id="J_Box">
    33     <h1>爱情保卫战</h1>
    34     <h1>爱情保卫战</h1>
    35     <h1>爱情保卫战</h1>
    36     <h1>爱情保卫战</h1>
    37     <h1>爱情保卫战</h1>
    38     <h1>爱情保卫战</h1>
    39     <h1>爱情保卫战</h1>
    40     <h1>爱情保卫战</h1>
    41     <h1>爱情保卫战</h1>
    42     <h1>爱情保卫战</h1>
    43     <h1>爱情保卫战</h1>
    44     <h1>爱情保卫战</h1>
    45     <h1>爱情保卫战</h1>
    46     <h1>爱情保卫战</h1>
    47     <h1>爱情保卫战</h1>
    48     <h1>爱情保卫战</h1>
    49     <h1>爱情保卫战</h1>
    50     <h1>爱情保卫战</h1>
    51     <h1>爱情保卫战</h1>
    52     <h1>爱情保卫战</h1>
    53     <h1>爱情保卫战</h1>
    54     <h1>爱情保卫战</h1>
    55     <h1>爱情保卫战</h1>
    56     <h1>爱情保卫战</h1>
    57     <h1>爱情保卫战</h1>
    58     <h1>爱情保卫战</h1>
    59     <h1>爱情保卫战</h1>
    60     <h1>爱情保卫战</h1>
    61     <h1>爱情保卫战</h1>
    62     <h1>爱情保卫战</h1>
    63     <h1>爱情保卫战</h1>
    64     <h1>爱情保卫战</h1>
    65     <h1>爱情保卫战</h1>
    66     <h1>爱情保卫战</h1>
    67     <h1>爱情保卫战</h1>
    68     <h1>爱情保卫战</h1>
    69     <h1>爱情保卫战</h1>
    70     <h1>爱情保卫战</h1>
    71     <h1>爱情保卫战</h1>
    72     <h1>爱情保卫战</h1>
    73     <h1>爱情保卫战</h1>
    74     <h1>爱情保卫战</h1>
    75     <h1>爱情保卫战</h1>
    76     <h1>爱情保卫战</h1>
    77     <h1>爱情保卫战</h1>
    78     <h1>爱情保卫战</h1>
    79     <h1>爱情保卫战</h1>
    80 </div>
    81 </body>
    82 </html>
  • 相关阅读:
    floating IP 原理分析
    创建 floating IP
    Why Namespace?
    虚拟 ​router 原理分析- 每天5分钟玩转 OpenStack(101)
    链接脚本使用一例2---将二进制文件 如图片、MP3音乐、词典一类的东西作为目标文件中的一个段
    linux-2.6.26内核中ARM中断实现详解(转)
    有关Cache –(1) linux list之中的Prefetc
    Linux 内核中的 GCC 特性
    对entry-common.S和call.S的部分理解1
    kernel&uboot学习笔记
  • 原文地址:https://www.cnblogs.com/yangguoe/p/8175994.html
Copyright © 2020-2023  润新知