jQuery 實現 Scroll to Top 滾動到頁面頂部
阿新 • • 發佈：2019-02-11
<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01//EN" "http://www.w3.org/TR/html4/strict.dtd"> <html> <head> <meta http-equiv="Content-Type" content="text/html; charset=utf-8"> <title></title> <style> *body { background-attachment: fixed; background-image: url(about:blank); /* 必須地，防抖動 */ } *body #toTop { position: absolute; top:expression(eval(document.documentElement.scrollTop+document.documentElement.clientHeight-this.offsetHeight-10)); /* 底部固定懸浮 */ } #toTop { border: 1px solid; bottom: 10px; position: fixed; right: 10px; } </style> </head> <script src='http://code.jquery.com/jquery.js'></script> <script> $(document).ready(function() { var toTop = $("#toTop"); if ($(window).scrollTop() < 500) { toTop.hide(); } $(window).scroll(function() { if ($(window).scrollTop() < 500) { toTop.fadeOut("fast"); } else { toTop.fadeIn("fast"); } }); toTop.click(function() { $("html,body").animate({ scrollTop: 0 }, 500); return false }); }); </script> <body> <div style="height:3000px;"></div> <a href="#" id="toTop">Scroll to Top ^</a> </body> </html>