您的位置：首页 > Web前端 > JavaScript

JS实现吸附(adsorption)效果

2017-10-24 09:28 134 查看
当页面向下滚动到一定位置时，原来处在页面中间的导航栏，吸附在页面顶端，保持一直可见

当页面向上滚动到一定位置时，导航栏可以恢复到原始位置

代码如下：

$(function() {
function adsorption(){
var scrollTop=0;
$(window).scroll(function () {
scrollTop=document.body.scrollTop||document.documentElement.scrollTop;
if(scrollTop>150){
$("header").css("display","none");
$("#top").css({
"position":"fixed",
"background":"url('../image/index.png') repeat-x",
"background-size":"cover"
});
}else{
$("header").css("display","");
$("#top").css({
"position":"",
"background":""
});
}
});
}
adsorption();
});
内容来自用户分享和网络整理，不保证内容的准确性，如有侵权内容，可联系管理员处理 点击这里给我发消息
标签： 
相关文章推荐
新的分享
章节导航