我正在尝试使用ScrollToFixed进行简单的固定滚动,但我遇到了一些奇怪的行为
我准备了一个显示以下问题的jsfiddle :
html:
<div class="row-fluid">
<div id="car_left_col" class="span2">left</div>
<div id="car_center" class="span8">
<div class="car_main thumbnail">
<div class="car_cover">
<img alt="" src="http://www.autopulze.com/wp-content/uploads/2012/07/Rolls-Royce-Silver-Ghost-the-Best-Car-in-the-World.jpg">
</div>
<hr>
<div class="car_page_creator"></div>
</div>
<div class="car_talk">here are the comments for the car</div>
</div>
<div id="car_right_col" class="span2">
<div class="car_vote test_fixed">I should not move</div>
</div>
<div class="long"></div>
CSS:
.long {
height: 10000px;
}
#car_right_col {
position: relative;
}
.car_main {
position: relative;
padding: 0;
}
.car_cover {
width: 100%;
position: relative;
}
.car_cover img {
width: 100%;
}
.test_fixed {
position: static;
}
.car_vote {
position: relative;
}
js:
$(document).ready(function () {
$('.test_fixed').scrollToFixed({
marginTop: 45,
limit: $('.car_page_creator').offset().top
});
});
- 一直向下滚动时,请注意一个水平滚动条,将页面可笑地向右拉伸
- 我认为这与第一个问题有关,要修复的项目,向下滚动时
.test-fixed
具有非常大的属性left
- 通过单击并按住滚动条向上滚动(从一直向下)时,一旦到达固定项目的位置,它就会不稳定
我认为我的 html 和 css 非常标准,没有什么特别之处。这种行为是由于我的代码还是插件中的错误?