滚动后粘贴标题？

Question

还好这里有什么,我想问问,的导航栏的例子今日美国.

我正在使用bootstrap词缀.这是我的代码

<div class="header">
  <div class="header-1">
    <h1>this is some logo</h1>
  </div>
  <div class="header-2">
    <h3>this is some heading</h3>
  </div>
</div>
<div class="content" style="height:2500px;">
</div>
<div class="footer">
    this is a footer
</div>

JavaScript的

$('.header-2').affix({
});

如何将div header-2固定在顶部,(当有一些滚动并且div header-2只是到达顶部位置时)我之前提到过的网站？

我很乐意看到header-1和header-2,但是一些滚动应该隐藏header-1并坚持header-2到最顶端.

谢谢

Answer 1

看到这个Jsfiddle

您可以检查滑块的位置并相应地添加类

$(window).scroll(function () {
    if( $(window).scrollTop() > $('#header-2').offset().top && !($('#header-2').hasClass('posi'))){
      $('#header-2').addClass('posi');
    } else if ($(window).scrollTop() == 0){
      $('#header-2').removeClass('posi');
    }
});

Answer 2

使用jquery看看这个例子 http://jsfiddle.net/5n5MA/2/

var fixmeTop = $('.fixme').offset().top; // Get initial position
$(window).scroll(function() {            // Assign scroll event listener
var currentScroll = $(window).scrollTop(); // Get current position
if (currentScroll >= fixmeTop) { // Make it fixed if you've scrolled to it
    $('.fixme').css({
        position: 'fixed',
        top: '0',
        left: '0'
    });
} else {                       // Make it static if you scroll above
    $('.fixme').css({
        position: 'static'
    });
}

});