<!DOCTYPE html><html lang="en"><head> ???<meta charset="UTF-8"> ???<title>回到顶部</title> ???<meta name="viewport" content="width=1200, maximum-scale=1.0, user-scalable=1"> ???<style> ???????.scrollToTop{ ???????????display: block; ???????????width: 42px; ???????????height: 42px; ???????????position: fixed; ???????????bottom: 5%; ???????????right: 2%; ???????????display: none; ???????????font-size: 40px; ???????????background: #232323; ???????????color: #ebebeb; ???????????border-radius: 3px; ???????????text-align: center; ???????????line-height: 38px; ???????????z-index: 999; ???????} ???????.scrollToTop i img{margin:9px 0px 0px 2px;} ???</style></head><body style="height:2000px"> ???????<a href="#" title="sroll" class="scrollToTop"><i><img src="https://www.cnblogs.com/images/cnblogs_com/wrongcode/1426773/o_uptop0.png" ></i></a><script src="https://cdn.bootcss.com/jquery/3.3.1/jquery.min.js"></script><script type="text/javascript"> ???????$(window).scroll(function() { ???????????if ($(this).scrollTop() > 300) { ???????????????$(‘.scrollToTop‘).fadeIn(); ???????????} else { ???????????????$(‘.scrollToTop‘).fadeOut(); ???????????} ???????}); ???????$(‘.scrollToTop‘).on("click", function() { ???????????$(‘html, body‘).animate({ ???????????????scrollTop: 0 ???????????}, 800); ???????????return false; ???????});</script></body></html>jquery点击回到顶部
原文地址：https://www.cnblogs.com/phplearn/p/10610513.html