html
<header class="main-header">
</header>
css
.main-header {
position: fixed;
z-index: 1030;
left:0;
top:0;
width:100%;
transition: all .5s;
}
js
//头部导航加背景
$(window).scroll(function() {
//导航样式
var pc_nav = $('.main-header');
if (pc_nav.offset().top >= 1) {
pc_nav.css({
'background': 'rgba(8,48,126,1)',
});
} else {
pc_nav.css({
'background': 'rgba(8,48,126,0)',
});
}
});