jquery top 按钮回到页面最顶端的实现
<!DOCTYPE html><html lang="en">
<head>
<meta charset="UTF-8">
<title>Title</title>
<style>
.container{
background-color:#C4C4C4;
height:1500px;
width:600px;}
#src-to-top{
height:40px;
width::40px;
color:#fff;
position:fixed;
right:20px;
bottom:20px;
background-color:#AEAEAE;
}
.showTop{
display:none;}
</style>
<script src="js/jquery-3.3.1.js"></script>
</head>
<body>
<div class="container"></div>
<div id="src-to-top" class="showTop"><strong>TOP</strong></div>
<script>
$(document).ready(function(e) {
//窗口滚动事件中 实现top按钮的显示与隐藏
window.οnscrοll=function(){
var scroT=$(window).scrollTop()
if(scroT>600){
$("#src-to-top").removeClass("showTop");
}else{
$("#src-to-top").addClass("showTop");
}
}
//实现 top单击回到顶部的事件
var istt=$("#src-to-top");
istt.οnclick=function(){
$(window).scrollTop(0);
}
});
</script>
</body>
</html>文档来源：51CTO技术博客https://blog.51cto.com/u_15288038/3029052
页:
[1]