zoukankan      html  css  js  c++  java
  • 返回顶部按钮的做法

      注意:1、 $('html,body').animate({scrollTop:0},1000);这句代码一定要一定要同时选中html及body两元素。

         2、 if($(window).scrollTop()>$(window).height())中,$(window).height()可以换成别的元素到浏览器最顶部的高度H,从而当窗口的scrollTop()大于这个高度H的时候,需要显示的元素就会显示出来。

      1 <!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN" "http://www.w3.org/TR/html4/loose.dtd">
      2 <html>
      3 <head>
      4 <meta http-equiv="Content-Type" content="text/html; charset=utf-8">
      5 <title>无标题文档</title>
      6 <style type="text/css">
      7 div{ width:80px; height:80px; background:#FC9; cursor: pointer; position:fixed; right:20px; bottom:20px; display:none;}
      8 </style>
      9 <script type="text/javascript" src="jquery-1.11.2.min.js"></script>
     10 <script type="text/javascript">
     11 $(function(){
     12     $(window).scroll(function(e) {
     13         if($(window).scrollTop()>$(window).height()){
     14             $('div').fadeIn();
     15         }else{
     16             $('div').fadeOut();    
     17         }
     18     });    
     19     $('div').click(function(e) {
     20         $('html,body').animate({scrollTop:0},1000);
     21     });
     22 })
     23 </script>
     24 </head>
     25 
     26 <body>
     27 <div></div>
     28 <p>text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text</p>
     29 <p>text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text</p>
     30 <p>text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text</p>
     31 <p>text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text</p>
     32 <p>text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text</p>
     33 <p>text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text</p>
     34 <p>text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text</p>
     35 <p>text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text</p>
     36 <p>text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text</p>
     37 <p>text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text</p>
     38 <p>text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text</p>
     39 <p>text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text</p>
     40 <p>text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text</p>
     41 <p>text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text</p>
     42 <p>text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text</p>
     43 <p>text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text</p>
     44 <p>text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text</p>
     45 <p>text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text</p>
     46 <p>text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text</p>
     47 <p>text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text</p>
     48 <p>text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text</p>
     49 <p>text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text</p>
     50 <p>text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text</p>
     51 <p>text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text</p>
     52 <p>text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text</p>
     53 <p>text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text</p>
     54 <p>text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text</p>
     55 <p>text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text</p>
     56 <p>text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text</p>
     57 <p>text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text</p>
     58 <p>text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text</p>
     59 <p>text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text</p>
     60 <p>text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text</p>
     61 <p>text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text</p>
     62 <p>text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text</p>
     63 <p>text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text</p>
     64 <p>text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text</p>
     65 <p>text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text</p>
     66 <p>text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text</p>
     67 <p>text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text</p>
     68 <p>text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text</p>
     69 <p>text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text</p>
     70 <p>text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text</p>
     71 <p>text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text</p>
     72 <p>text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text</p>
     73 <p>text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text</p>
     74 <p>text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text</p>
     75 <p>text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text</p>
     76 <p>text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text</p>
     77 <p>text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text</p>
     78 <p>text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text</p>
     79 <p>text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text</p>
     80 <p>text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text</p>
     81 <p>text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text</p>
     82 <p>text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text</p>
     83 <p>text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text</p>
     84 <p>text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text</p>
     85 <p>text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text</p>
     86 <p>text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text</p>
     87 <p>text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text</p>
     88 <p>text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text</p>
     89 <p>text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text</p>
     90 <p>text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text</p>
     91 <p>text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text</p>
     92 <p>text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text</p>
     93 <p>text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text</p>
     94 <p>text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text</p>
     95 <p>text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text</p>
     96 <p>text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text</p>
     97 <p>text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text</p>
     98 <p>text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text</p>
     99 <p>text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text</p>
    100 <p>text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text</p>
    101 <p>text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text</p>
    102 <p>text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text</p>
    103 <p>text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text</p>
    104 <p>text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text</p>
    105 <p>text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text</p>
    106 <p>text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text</p>
    107 <p>text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text</p>
    108 <p>text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text</p>
    109 <p>text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text</p>
    110 <p>text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text</p>
    111 <p>text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text</p>
    112 <p>text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text</p>
    113 <p>text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text</p>
    114 <p>text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text</p>
    115 <p>text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text</p>
    116 <p>text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text</p>
    117 <p>text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text</p>
    118 <p>text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text</p>
    119 <p>text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text</p>
    120 <p>text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text</p>
    121 <p>text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text</p>
    122 <p>text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text</p>
    123 <p>text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text</p>
    124 <p>text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text</p>
    125 <p>text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text</p>
    126 <p>text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text</p>
    127 <p>text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text</p>
    128 <p>text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text</p>
    129 <p>text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text</p>
    130 <p>text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text</p>
    131 <p>text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text</p>
    132 <p>text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text</p>
    133 <p>text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text</p>
    134 <p>text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text</p>
    135 <p>text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text</p>
    136 <p>text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text</p>
    137 <p>text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text</p>
    138 <p>text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text</p>
    139 <p>text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text</p>
    140 <p>text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text</p>
    141 <p>text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text</p>
    142 <p>text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text</p>
    143 <p>text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text</p>
    144 <p>text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text</p>
    145 <p>text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text</p>
    146 <p>text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text</p>
    147 <p>text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text</p>
    148 <p>text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text</p>
    149 <p>text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text</p>
    150 <p>text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text</p>
    151 <p>text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text</p>
    152 <p>text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text</p>
    153 <p>text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text</p>
    154 <p>text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text</p>
    155 </body>
    156 </html>
  • 相关阅读:
    思维导图形式带你读完《大型网站技术架构》中
    思维导图形式带你读完《大型网站技术架构》上
    淘淘商城项目补充(2)商品上架和下架功能实现
    淘淘商城项目补充(1)批量删除商品功能实现
    商城项目(ssm+dubbo+nginx+mysql统合项目)总结(3)
    阿里Java研发工程师实习面经,附面试技巧
    商城项目(ssm+dubbo+nginx+mysql统合项目)总结(2)
    商城项目(ssm+dubbo+nginx+mysql统合项目)总结(1)
    高性能优秀的服务框架-dubbo介绍
    回溯算法_01背包问题_Java实现
  • 原文地址:https://www.cnblogs.com/darkterror/p/5007483.html
Copyright © 2011-2022 走看看