快速返回顶部_word返回顶部快捷键

快速返回顶部_word返回顶部快捷键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,iVBORw0KGgoAAAA…

快速返回顶部_word返回顶部快捷键"

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

(0)
编程小号编程小号

相关推荐

发表回复

您的电子邮箱地址不会被公开。 必填项已用*标注