scrollTop兼容封装 

 1 <!DOCTYPE html>
 2 <html>
 3 <head lang="en">
 4     <meta charset="UTF-8">
 5     <title></title>
 6     <style>
 7         body {
 8             height: 3000px;
 9         }
10     </style>
11 </head>
12 <body>
13 
14 </body>
15 </html>
16 <script>
17     //   var json = {left: 10, right: 10}  变异
18     //json.left   json.top
19     function scroll() {
20         if(window.pageYOffset != null)  //  ie9+ 和其他浏览器
21         {
22             return {
23                 left: window.pageXOffset,
24                 top: window.pageYOffset
25             }
26         }
27         else if(document.compatMode == "CSS1Compat")  // 声明的了 DTD
28         // 检测是不是怪异模式的浏览器 -- 就是没有 声明<!DOCTYPE html>
29         {
30             return {
31                 left: document.documentElement.scrollLeft,
32                 top: document.documentElement.scrollTop
33             }
34         }
35         return { //  剩下的肯定是怪异模式的
36             left: document.body.scrollLeft,
37             top: document.body.scrollTop
38         }
39     }
40     window.onscroll = function() {
41         console.log(scroll().top);
42     }
43 </script>

 

posted @ 2017-12-28 22:35  前端极客  阅读(253)  评论(0)  编辑  收藏  举报