Question

我在页面右侧有一个链接列表，点击后加载ajax内容

因为链接列表比我想要始终保持加载内容在视图中的内容长

我使用以下代码执行此操作

$(window).scroll(function(){
    $("#answertext")
    .stop()
    .animate({"marginTop": ($(window).scrollTop() - 500) + "px"}, "slow" );
});

问题是我希望将其保留在其持有div中，此时如果我滚动到页面顶部div将其包含div并悬停在上面的内容上。

查看他的网址以查看问题（点击要在ajax内容中加载的新闻项，然后滚动页面） Demo

更新：

感谢locrizak，对您的代码进行了轻微编辑：

就像你一样，在_offset声明中消除了＃最初它没有做任何事情所以我将_offset更改为包含div'＃tabpage5'的_offset 现在，当在内容中加载时，它会将div放在正确的位置。

var tp5_offset = $("#tabpage5").offset();
if ( $(window).scrollTop() > tp5_offset.top ){
    $("#answertext")
    .stop()
    .animate({"marginTop": ($(window).scrollTop() - tp5_offset.top) + "px"}, "slow" );
}

虽然我希望它在窗口滚动时滚动，但仍然在#tabpage5 div的范围内。关于如何做到的任何想法？

Answer 1

按如下方式更改此行：

.animate({"marginTop": (Math.max(0, $(window).scrollTop() - 500)) + "px"}, "slow" );

Answer 2

试试这个：

var _offset = $("answertext").offset();
if ( $(window).scrollTop() > _offset.top ){
    $("#answertext")
    .stop()
    .animate({"marginTop": ($(window).scrollTop() - _offset.top) + "px"}, "slow" );

}

这应该将内容放在最顶层的内容区域。

更新

你可以这样做：

var _offset = $("answertext").offset();
var _currentSpace = parseFloat($("answertext").css('marginTop')) + $("answertext").height();
var _maxHeight = $('#infotext').height() + $('#infotext').offset().top;
if ( $(window).scrollTop() > _offset.top  && _currentSpace

由于你不断地将右侧的div设置得更大，所以在左侧高度上引用div更好，因为它没有变化。

让我知道它是如何运作的。

当页面在div中滚动时，jquery保持div在视图中

2 个答案:

更新