脚本正常工作,当向下滚动它确实将顶部标题放在窗口顶部但不幸的是有一些小问题正在驱使我香蕉!
jQuery(document).ready(function() {
var $window = jQuery(window);
$window.scroll(function(){
if ($window.scrollTop() >= 130) {
jQuery('.custom-site-header').addClass('top-header');
} else {
jQuery('.custom-site-header').removeClass('top-header');
}
});
});
.top-header
{
position: fixed;
margin: 0 auto;
width: 100%;
z-index: 1000;
background: #fff;
height:80px;
top:0px;
}
<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>
<div class="wrapper">
<div class="container">
<div class="custom-site-header">Fixed Header</div>
</div>
<section class="body_section">
</section>
</div>
答案 0 :(得分:0)
请尝试此代码。希望这会有所帮助!!!!
jQuery(document).ready(function() {
var $window = jQuery(window);
$window.scroll(function(){
if ($window.scrollTop() >= 130) {
jQuery('.custom-site-header').addClass('top-header');
} else {
jQuery('.custom-site-header').removeClass('top-header');
}
});
});
.top-header
{
position: fixed;
margin: 0 auto;
width: 100%;
z-index: 1000;
background: #fff;
height:80px;
top:0px;
}
.body_section
{
height:1000px;
width:100%;
background:#ccc;
}
<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>
<div class="wrapper">
<div class="container">
<div class="custom-site-header">Fixed Header</div>
</div>
<section class="body_section">
</section>
</div>