wordpress 返回顶部功能

Gavin Wu 2020年12月31日 8:12 Wordpress 1,144 Views

给wordpress添加一个简单的返回顶部的功能，代码如下。

HTML部分

1
2
3

CSS部分

1
2
3
4
5
6
7
8
9
10
11
12
13
14

._top {
position:fixed;
right:0;
bottom:30%;
line-height:50px;
text-align:center;
cursor:pointer;
width:50px;
height:50px;
border:1px solid #CCC;
display:none;
background-color:#333;
color:aliceblue;
}

JS部分

1
2
3
4
5
6
7
8
9
10
11
12
13
14
15

$(function() {
$(window).scroll(function() {
var _top = $(window).scrollTop();
if (_top > 300) {
$('._top').fadeIn(600);
} else {
$('._top').fadeOut(600);
}
});
$("._top").click(function() {
$("html,body").animate({
scrollTop: 0
}, 500);
});
});

其实不仅是用在wordpress上，可以用在任何网页上。