效果图：
GIF1122.gif
<!DOCTYPE html>
<html>
<head>
<meta charset="UTF-8">
<title></title>
</head>
<body>
<div>
<br />&1
<br />&1
<br />&1
<br />&1
<br />&1
<br />&1
<br />&1
<br />&1
<br />&1
<br />&1
<br />&1
<br />&1
<br />&1
<br />&1
<br />&1
<br />&1
<br />&1
<br />&1
<br />&1
<br />&1
<br />&1
<br />&1
<br />&1
<br />&1
<br />&1
<br />&1
<br />&1
<br />&1
<br />&1
<br />&1
<br />&1
<br />&1
<br />&1
<br />&1
<br />&1
<br />&1
<br />&1
<br />&1
<br />&1
<br />&1
<br />&1
<br />&1
<br />&1
<br />&1
<br />&1
<br />&1
<br />&1
<br />&1
<br />&1
<br />&1
<br />&1
<br />&1
<br />&1
<br />&1
<br />&1
<br />&1
<br />&1
<br />&1
<br />&1
<br />&1
<br />&1
<br />&1
<br />&1
<br />&1
<br />&1
<br />&1
<br />&1
<br />&1
<br />&1
<br />&1
<br />&1
<br />&1
<br />&1
<br />&1
<br />&1
<br />&1
<br />&1
<br />&1
<br />&1
<br />&1
<br />&1
<br />&1
<br />&1
<br />&1
<br />&1
<br />&1
<br />&1
<br />&1
<br />&1
<br />&1
<br />&1
<br />&1
<br />&1
<br />&1
<br />&1
<br />&1
<br />&1
<br />&1
<br />&1
<br />&1
<!--隐藏上升模块-->
<div class="slide-nooe">
<div class="slide-nav"></div>
<div class="slide-booto"></div>
</div>
<style>
/*返回顶部栏的css*/
.slide-nooe{width: 65px ; height: 111px;border-radius:5px; position:fixed;display:none;right:30px; bottom:80px; text-align: center; z-index:8 ;}
.slide-nav,.slide-booto{ width:65px; height:55px;overflow-x: initial; }
.slide-nav{background: url(img/1F.png) no-repeat center center; background-size: cover; margin-bottom:1px; opacity: 0.8;}
.slide-booto{background: url(img/2F.png) no-repeat center center; background-size: cover;opacity: 0.8;}
</style>
</div>
<script src="js/jquery-1.11.3.js"></script>
<script>
$(function(){
$(window).scroll(function(){
var divs=$(window).scrollTop()
if(divs>0){
$('.slide-nooe').show(400)
}else{
$('.slide-nooe').hide(400)
}
})
$('.slide-nav').click(function(){
$('body,html').animate({scrollTop:0},800);
})
$(function(){
$('.slide-booto').click(function(){
var docH = $(document).height()//是文档的高度。
var winH = $(window).height()//获取的是窗口的可视区域的高度获取的是文档的高度。
$('body,html').animate({scrollTop:docH-winH},500)
})
})
})
</script>
</body>
</html>
固定导航栏
//固定导航栏
function navtt1(){
var height=0;
height = $(".fh628-ul").offset().top;
$(window).scroll(function() {
var w = $("body").scrollTop() || $(document).scrollTop();
var whtl=$(document).height()-$(window).height() //获取滚动值
if(w > height&&whtl>height) { $(".fh628-ul").addClass("pfguding"); }
else{ $(".fh628-ul").removeClass("pfguding") }
});
}
if( $(".fh628-ul").length>0){
navtt1();
}
