jquery实现当页面滚动超过一屏时显示返回顶部按钮
<!DOCTYPE html> <html> <head> <meta charset=utf-8" /> <title>jquery实现当页面滚动超过一屏时显示返回顶部按钮</title> <style> #go_top{position:fixed; LEFT: 85%;bottom:50px;} </style> <script src="http://libs.baidu.com/jquery/1.10.2/jquery.min.js"></script> <script> $(document).ready(function(){ $("#go_top").hide(); $(function () { //检测屏幕高度 var height=$(window).height(); //scroll() 方法为滚动事件 $(window).scroll(function(){ if ($(window).scrollTop()>height){ $("#go_top").fadeIn(500); }else{ $("#go_top").fadeOut(500); } }); $("#go_top").click(function(){ $('body,html').animate({scrollTop:0},100); return false; }); }); }); </script> </head> <body> <br/>1<br/>1<br/>1<br/>1<br/>1<br/>1<br/>1<br/>1<br/>1<br/>1<br/> <br/>1<br/>1<br/>1<br/>1<br/>1<br/>1<br/>1<br/>1<br/>1<br/>1<br/> <div id="go_top"> <img src="./img/top.png"/ alt="回到顶部图片"> </div> </body> </html>
本文来自博客园,作者:quitpoison,转载请注明原文链接:https://www.cnblogs.com/quitpoison/articles/8794304.html