返回顶部按钮的做法

  注意: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>
posted @ 2015-11-30 16:09  ifIhaveWings  阅读(329)  评论(3编辑  收藏  举报