核心提示:由于不同版本的浏览器对于scroll的兼容性的支持不一样,所以我们需要做兼容性的考虑。为了避免每次使用的时候都要做兼容性的考虑。我们封装了scroll的函数。可以引入到样式中。!DOCTYPE htm...
由于不同版本的浏览器对于scroll的兼容性的支持不一样,所以我们需要做兼容性的考虑。为了避免每次使用的时候都要做兼容性的考虑。我们封装了scroll的函数。可以引入到样式中。
<!DOCTYPE html> <html> <head lang="en"> <meta charset="UTF-8"> <title></title> <style> body { height: 3000px; } </style> </head> <body> </body> </html> <script> // var json = {left: 10, right: 10} 变异 //json.left json.top function scroll() { if(window.pageYOffset != null) // ie9+ 和其他浏览器 { return { left: window.pageXOffset, top: window.pageYOffset } } else if(document.compatMode == "CSS1Compat") // 声明的了 DTD // 检测是不是怪异模式的浏览器 -- 就是没有 声明<!DOCTYPE html> { return { left: document.documentElement.scrollLeft, top: document.documentElement.scrollTop } } return { // 剩下的肯定是怪异模式的 left: document.body.scrollLeft, top: document.body.scrollTop } } // 使用这个函数 window.onscroll = function() { console.log(scroll().top); } </script>