<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<title>Title
</title>
<style>
.
div{
width:
100%
;
height:
1000px;
}
.
div1{
background:
red;
}
.
div2{
background:
aqua;
}
.
div3{
text-align:
center;
width:
100px;
height:
50px;
background:
darkgray;
position:
fixed;
right:
10px;
bottom:
10px;
line-height:
50px;
}
.
hide{
display:
none;
}
</style>
</head>
<body>
<div class="div1 div"></div>
<div class="div2 div"></div>
<div class="div3 hide" οnclick="returnTop()
">返回顶部
</div>
<script src="https://code.jquery.com/jquery-3.3.1.min.js"></script>
<script>
window.οnscrοll=
function () {
if (
$(window).scrollTop()>
50){
$(
".div3").
removeClass(
"hide")
}
else {
$(
".div3").
addClass(
"hide")
}
}
function returnTop(){
$(window).scrollTop(
0)
}
</script>
</body>
</html>
转载请注明原文地址: https://www.6miu.com/read-2619766.html