关于jquery滑出div

Question

我希望当用户向下滚动到绝对底部时，一个div应该从右侧出来，当用户单击“关闭”按钮时，它会向右滑动。我得到了一个非常相似的示例代码，但是我希望在到达底部时，div应该会出现。所以在这里，我给出了代码，并告诉我应该修改什么。

<p id="last">
Some paragraph text
</p>

<div id="slidebox">
<a class="close"></a>
<p>More in Technology & Science (4 of 23 articles)</p>
<h2>The Social Impact of Scientific Research and new Technologies</h2>
<a class="more">Read More »</a>
</div>

$(function() {
$(window).scroll(function(){
    var distanceTop = $('#last').offset().top - $(window).height();

    if  ($(window).scrollTop() > distanceTop)
        $('#slidebox').animate({'right':'0px'},300);
    else
        $('#slidebox').stop(true).animate({'right':'-430px'},100);
});

$('#slidebox .close').bind('click',function(){
    $(this).parent().remove();
});
});

我认为这一行如果($(窗口).scrollTop()> distanceTop)需要更改以确定用户到达页面底部的大部分。

完整的源代码和演示url是http://tympanus.net/codrops/2010/04/13/end-of-page-slide-out-box/

http://tympanus.net/Tutorials/EndPageSlideOutBox/

谢谢

Answer 1

不太确定.last扮演的角色是什么，但是如果您想在用户到达网页底部时显示容器，可以使用以下内容：

if($(window).scrollTop() == ($('body').height() - $(window).height()))
    $('#slidebox').animate({'right':'0px'},300);
else
    $('#slidebox').stop(true).animate({'right':'-430px'},100);

作为下面的jsFiddle，请参阅演示。

Answer 2

行var distanceTop = $('#last').offset().top - $(window).height();有效地计算“当#last元素出现在屏幕底部时”，也就是当您的框处于动画状态时。

我认为您需要var distanceTop = $('#last').offset().top + $(window).height();，它应该是“当#last元素出现在屏幕顶部时”。