jQuery練習t230,從0到1
阿新 • • 發佈:2021-02-05
技術標籤:jQueryJavaScriptjavascriptjquery
<!DOCTYPE html> <html lang="en"> <head> <meta charset="UTF-8"> <title>Title</title> <style type="text/css"> body{ height: 1800px; } div{ position: fixed; right: 50px; bottom: 50px; display: none; width: 40px; height: 40px; color: white; background-color: #45b823; font-family: 微軟雅黑; font-size: 15px; font-weight: bold; text-align: center; cursor:pointer; } </style> <script src="../js/jquery-3.5.1.js"></script> <script> $(function () { //滾動事件 //回頂部特效 $(window).scroll(function () { if($(this).scrollTop() > 300) { $("div").css("display","inline-block"); } else { $("div").css("display","none"); } }); $("div").click(function () { $("html,body").scrollTop(0); }); }); </script> </head> <body> <h3>蝦米大王</h3> <div>回到頂部</div> </body> </html>