Examples of pure JavaScript back to the top

Recommended for you: Get network issues from WhatsUp Gold. Not end users.

  Many websites are using cascade loading mode, like QQ friends dynamic space load, in order to better user experience, many sites will be added back to the top of the connection, but most sites are immediately returned to the top, of course, that such benefits, but I was more like a shining. People, so I can be like a sliding roller on the top. Directly on the code.

 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>Insert title here</title>
 6 <script type="text/javascript">
 7 function goTop(acceleration, time) {
 8      acceleration = acceleration || 0.1;
 9      time = time || 16;
10      
11      var x1 = 0;
12      var y1 = 0;
13      var x2 = 0;
14      var y2 = 0;
15      var x3 = 0;
16      var y3 = 0;
17      
18      if (document.documentElement) {
19       x1 = document.documentElement.scrollLeft || 0;
20       y1 = document.documentElement.scrollTop || 0;
21      }
22      if (document.body) {
23       x2 = document.body.scrollLeft || 0;
24       y2 = document.body.scrollTop || 0;
25      }
26      var x3 = window.scrollX || 0;
27      var y3 = window.scrollY || 0;
28 
29 
30 
31 
32      
33      // Scroll to the top of the page horizontal distance
34      var x = Math.max(x1, Math.max(x2, x3));
35      // Scroll to the vertical distance from the top of the page
36      var y = Math.max(y1, Math.max(y2, y3));
37      
38      // Rolling distance = the distance / speed, because the distance is more and more small, the speed is a number greater than 1, so the rolling distance will be increasingly small
39      var speed = 1 + acceleration;
40      window.scrollTo(Math.floor(x / speed), Math.floor(y / speed));
41      
42      // If the distance is not zero, continue to call the function iteration
43      if(x > 0 || y > 0) {
44       var invokeFunction = "goTop(" + acceleration + ", " + time + ")";
45       window.setTimeout(invokeFunction, time);
46      }
47     }
48 </script>
49 </head>
50 <body>
51     1adfsssssssssssssssssssssssssssssssssssssssssssssssssss<br />
52     1<br />
53     1<br />1<br />
54     1<br />1<br />1<br />1<br />
55     1<br />1<br />1<br />1<br />
56     1<br />1<br />1<br />1<br />
57     1<br />1<br />1<br />1<br />
58     1<br />1<br />1<br />1<br />
59     1<br />1<br />1<br />1<br />
60     1<br />1<br />1<br />1<br />
61     1<br />1<br />1<br />1<br />
62     1<br />1<br />1<br />1<br />
63     1<br />1<br />1<br />1<br />
64     1<br />1<br />1<br />1<br />
65     1<br />1<br />1<br />1<br />
66     1<br />1<br />1<br />1<br />
67     1<br />1<br />1<br />1<br />
68     1<br />1<br />1<br />1<br />
69     1<br />1<br />1<br />1<br />
70     1<br />1<br />1<br />1<br />
71     1<br />1<br />1<br />1<br />
72     1<br />1<br />1<br />1<br />
73     1<br />1<br />1<br />1<br />
74     1<br />1<br />1<br />1<br />
75     1<br />1<br />
76     fdsfaddddddddddddddddddd
77     
78     <a href="javascript:;" onclick="goTop();return false;">TOP</a>
79 </body>
80 </html>

Should be very simple, it gets the scroll position, for each kernel are not the same, this integration at. We want to help.

Why write a blog? Because of love, I miss her, only let himself busy will ease the lovelorn, good sad ah, I must seize the next time, he wouldn't break up. I was dumped. Hey. . .

Recommended from our users: Dynamic Network Monitoring from WhatsUp Gold from IPSwitch. Free Download

Posted by Theodore at November 14, 2013 - 3:48 PM