ページのスクロールに基づいて要素をスティック/アンスティックする - javascript、jquery、sticky

使用しています https://github.com/garand/sticky ページスクロール時に要素を画面の上部に固定する。それはかなりうまくいきますが、それを使用しようとしています。 $("#sticker").unstick(); ページの特定の部分に到達したときに同じ要素の固定を解除する機能。

どうすればこれを達成できますか？

これが私がこれまでにしたことです。

<script type="text/javascript" src="http://ajax.googleapis.com/ajax/libs/jquery/1.4.2/jquery.min.js"></script>
<script src="url/sticky.min.js"></script>
<script>
$(document).ready(function(){
$(".banner").sticky({topSpacing:60});
$(".banner").unstick();
});
</script>

<div class="banner"><img src="/images/addresstoimage.jpg"></div>

回答：

ザ sticky プラグインは自動的に固定され、あなたの代わりになります。

両方を設定する必要があります。 topSpacing そして bottomSpacing パラメータとあなたの要素は、この2つの位置の間で粘着します。

$(document).ready(function() {
$(".banner").sticky(
{
topSpacing: 60,
bottomSpacing: 100
});
});