1.css
.backToTop {
width: 0.84rem;
height: 0.84rem;
position: fixed;
right: 4%;
bottom: 1.2rem;
display: none;
z-index: 999;
background-image: url(data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAAFQAAABWCAMAAABmfUH4AAAAeFBMVEWZmZkAAAAAAAA+Pj5OTk4AAAAAAAAAAAAAAAAAAAAAAACVlZWKiopgYGBgYGCampqamppwcHCamppkZGSQkJB8fHxhYWGZmZmVlZVycnJoaGiZmZmampqYmJiXl5dtbW2SkpJlZWVRUVGDg4OSkpJzc3NtbW16enrFjjGBAAAAKHRSTlOzABizLAQUBxELDo2MszSnmZ2erGVHsJJxPqaslYN+oGo3Lk6MmjyVKGDi6AAAA5hJREFUWMPt2Wlz2jAQBuDtomOlgC8OQw0E6PX//2HXwbBTGh3GfOlM3w+ZySQ8s17JspHgSyraOk8G+xhD3lmd/EgCtf6DU7dcbW+fRx313m513JcwpNwfV7ueJvcMqonB4tTCJ2lPBcOkR6KWUF1WDQTTrC4KyY5ANZPnIyRyPDOrc1GHqjhARg7cBZdApcwtZGYrxcZQLnNdQnbKNRebQr2UmV+sj6OERQUjUxVIEVST2nUwOt1OkQ6iRq3hqayVCaGkvsGT+aboc5Skzmdqpc9QjzuYkB36v1GHRTcF7Qp0j6hGVcGkVAr1A0pqCxOzVfQn6jA5SN/nycG6NQBuF19CPO1i8QbxlLcGQObFt5vZjNVkAwS1WEA8ezZZbSGeAu0dJXVIjCybOepB0Q3VeIZomuVsyGYP0ZxRDyipY6bJanw2HxUNKF7ig3oz21+L2WwZVy94RR2uouZX7uWPOaMNvPdqA5Gs0H2gpKL/xubsK7zxzzf+pVfLWKsU9ajGImmWMO/R269ddFZpRh2eIBQp7QOVwsM5oWPUq/A0uTdR0C6h7pVn1KikKegwGRbvEAw/rkBHFvx6cZ+YgkITV3eoweIqau7hEYUqqq7QgsPQff9jcbvZBZWlYFGH7n904LEK1CmmoLJoBWut0IMJLc/zhSygjyi0/Md5aKk2EB78+ZKVAApvy3l4+AGDKHQQRqGDIIoxFGIo/EeDqPlHUAMGy9eiJaMeq9eiFXpZUCajsqDI0jcdlaVP4y4X/Z75nq7lcRLP97qu28zB52cUqT28MHtF8oieHHlEy8vEqCRfJripzevMRhl5QUulqTd1lTWhnLxKplLzlKoz0AsmX3olG0Y3aVNeei2eIZV3Rt/T6BntgPJQJe//ql5m9PSgTP5XHkn+Vx4udfsKc8uFCmpRldMvv1Ro7yiHcD19oNZITAmquQFPTym5eC3o0IBq2uSvrhcvKMdj0U25TbsC/UAJqs3UjRmjBRV12haSmIL2bZ2y2YVWJHjY5XzOlP3Ov1DN6s9nNhB/sqkDKKsGi3as2RZo7qagolqD6jTOPCk0ls1PUFHHbh+LGUA51uO4jW70NmP33JkRW/LSzijKLSDMPTxAsjrzRMJysTnHHFymzT870dYbTB3IoPFSZhwVlhCDR0ccEjKNCuv6cq/yPXiNkRO0PFRYOYmTMEi9KGQ+Ki7Dnsh8hMgzKOJ4VGCmh2hO+hO/ATQIM4ahp3diAAAAAElFTkSuQmCC);
background-size: 0.84rem;
background-repeat: no-repeat;
background-position: center;
}
2.js
$(function () {
//点击回到顶部的元素
$(".backToTop").click(function () {
//以1秒的间隔返回顶部
$('body,html').animate({scrollTop: 0}, 1000);
});
//实现回到顶部元素的渐显与渐隐
$(window).scroll(function () {
//判断距离,当距离较小时,隐藏,当距离较大时显示
if ($(window).scrollTop() > 100){
//以1秒的间隔渐显元素
$(".backToTop").fadeIn(1000);
}else{
//以1秒的间隔渐隐元素
$(".backToTop").fadeOut(1000);
}
});
})
今天的文章快速返回顶部_word返回顶部快捷键分享到此就结束了,感谢您的阅读,如果确实帮到您,您可以动动手指转发给其他人。
版权声明:本文内容由互联网用户自发贡献,该文观点仅代表作者本人。本站仅提供信息存储空间服务,不拥有所有权,不承担相关法律责任。如发现本站有涉嫌侵权/违法违规的内容, 请发送邮件至 举报,一经查实,本站将立刻删除。
如需转载请保留出处:https://bianchenghao.cn/58029.html