javascript - 我如何跳过这个js的边距顶部？

Question

我一直试图弄清楚这一点；如何让 .float-div 在向下滚动时不从顶部边缘？我希望它在滚动时固定在窗口的顶部。如果您拿走 .top-entry ，它将正常工作。但是如何在不删除 .top-entry 的情况下修复它？

http://jsfiddle.net/loktar/Kjc6k/2/

var $scrollingDiv = $(".float-div");

$(window).scroll(function(){      
var y = $(this).scrollTop(),
$postEntry = $('.post-entry'),
maxY = $postEntry.offset().top + $postEntry.height(),
scrollHeight = $scrollingDiv.height();
if(y< maxY-scrollHeight ){
$scrollingDiv
.stop()
.animate({"marginTop": ($(window).scrollTop()) + "px"}, "slow" );        
}    
});

Answer 1

这是我的新答案，这是一个小提琴http://jsfiddle.net/Kjc6k/48/ 希望这就是你要找的:)

var $scrollingDiv = $(".float-div");


$(window).scroll(function(){  


var y = $(this).scrollTop(),
    $topEntry = $('.top-entry').height();
if( y > $topEntry){
    $scrollingDiv
    .stop()
    .animate({"margin-top": y + "px"}, "slow" );        
} 
else 
    $scrollingDiv
    .stop()
    .animate({"margin-top": "80px"}, "slow" ); 
});

Answer 2

添加top:0到 float-div 类将很容易解决这个问题。

.float-div {
position: absolute;
background: red;
top: 0;
}

更新小提琴：http: //jsfiddle.net/7KSTs/