私は次のjQuery関数を使用しています:
$(document).ready(function () {
var top = $('.aside').offset().top - parseFloat($('.aside').css('marginTop').replace(/auto/, 0));
$(window).scroll(function (event) {
// what the y position of the scroll is
var y = $(this).scrollTop();
// whether that's below the form
if (y >= top) {
// if so, ad the fixed class
$('.aside').addClass('fixed');
} else {
// otherwise remove it
$('.aside').removeClass('fixed');
}
});
});
ここで、固定DIV(.aside)を特定のDIVで停止する必要があります。
私のCSSを見てください。これは2列のレイアウトで、左側にメインの.content列があり、右側に.asideバーがあります。.content列の終わりまで.asideバーをスクロールさせたい。少なくとも.asideバーがフッターに到達したとき。あなたが私を理解してくれることを願っています=)
.content {
float:left;
}
.container.sticky .row {
position: relative;
background: #fff;
}
.aside-wrapper { /* required to avoid jumping */
left: 640px;
position: absolute;
}
.aside {
position: absolute;
top: 0;
}
.aside.fixed {
position: fixed;
top: 0;
}
これどうやってするの?