4

貼り付け機能を使って画面上部にヘッダーを付けたいのですが、ページの一部にしか付けられません。ユーザーが特定のポイントを超えてスクロールすると、分離する必要があります (コンテンツとともに上にスクロールします)。

このjsfiddleのスクリプトを使用しています。

私が今しようとしているのはこれです:

$('#nav-wrapper').height($("#nav").height());

$('#nav').affix({
    offset: $('#nav').position()
});
$('#nav').detached({
    offset: $('#bottom').position()
});

クラスは次の.detachedようになります。

.detached { position: static; }

これを機能させることはできません。助言がありますか?

4

3 に答える 3

3

TwitterBootstrapaffixモジュールにはそのオプションがありません。しかし、私は何度もhcStickyを使用しました、それは素晴らしいです。見てください、それは単に使用することであり、非常にうまく機能します。

于 2013-02-22T21:41:18.610 に答える
2

あなたのために働くかもしれない別のオプション:http://jsfiddle.net/panchroma/5n9vw/

HTML

<div class="header" data-spy="affix">
affixed header, released after scrolling 100px
</div>   

Javascript

$(document).ready(function(){
$(window).scroll(function(){
var y = $(window).scrollTop();
if( y > 100 ){
  $(".header.affix").css({'position':'static'});
} else {
  $(".header.affix").css({'position':'fixed'});
}
});
})  

幸運を!

于 2013-07-04T04:07:24.320 に答える