如何使div滚动到当前的div标头

我想创建一个div，位于内容块的下方，但是一旦页面滚动到足够的位置联系其顶部边界，固定到位并与页面一起滚动。我知道我在网上看到过至少有一个这样的例子，但我无法记住它的一生。如何使div滚动到当前的div标头

$(document).ready(function() { 
    $(window).scroll(function() { 
    }); 
});

我试图把这个内容显示在此小提琴

http://jsfiddle.net/HQS8s/

，但不知道如何实现这一点，请你让我知道如何做这个？？

来源

2015-04-07 Kiran

StickyJS是你可能想给一个试试jQuery插件，它的确如此：http://stickyjs.com/ – Salketer

尽管这个功能不应该是太多的代码。但是我们究竟在讨论什么样的粘性元素 - 它应该放在哪里？ – Shikkediel

我不确定你提到的是什么，我猜它应该在哪里添加数据，它可以在任何地方（在提到的小提琴的类命名数据上面） – Kiran

我已经修改您的jsfiddle如下（这是我从你的问题明白，如果我错了饶了我吧）

$(document).ready(function() { 
    var $window = $(window), 
     $headerBar = $('#headerBar'), 
     $headerBarAnchor = $('#headerBarAnchor'); 

     $(window).scroll(function() { 
     var window_top = $window.scrollTop(); 
     var div_top = $headerBarAnchor.offset().top; 
     if (window_top > div_top) { 
      // Make the div sticky. 
      $headerBar.addClass('stick'); 
      $headerBarAnchor.height($headerBar.height()); 
     } 
     else { 
      // Unstick the div. 
      $headerBar.removeClass('stick'); 
      $headerBarAnchor.height(0); 
     }  
     }); 
});

检查http://jsfiddle.net/jWaEv/12/

来源

2015-04-07 08:28:28

非常感谢，如果我在标题2中滚动，标题不可见。有什么困惑吗？ – Kiran

你的意思是单独滚动标题2然后标题1隐藏和滚动标题1然后标题2隐藏像这样 –

非常感谢回复，我需要一个类似的网站，如下所示http://slinky.iclanzan.com / – Kiran

如何使div滚动到当前的div标头

回答

相关问题