我遇到以下问题。我有一个DIV single-help
,它从-300px
动画到0px
当滚动从顶部900px
。我正在使用此代码。Div出现在> 900px滚动并停在页脚div
jQuery(window).scroll(function() {
var delayms = "900"; // mseconds to stay color
if (jQuery(this).scrollTop() > 900) {
jQuery('.single-help').stop().animate({ bottom: '0px' });
} else $(".single-help").click(function (e) {
jQuery('.single-help').stop().animate({ bottom: '-300px' });
jQuery('.single-help').css('display','none').delay('delayms');
})
});
这一切都有效,当我滚过900px
时,DIV出现。但是当我到达页面的页脚时。它涵盖了footer
DIV。现在我试图让.single-help
DIV在到达页脚时停止。对于我正在使用此代码:
$(window).scroll(function() {
if($(window).scrollTop() + $(window).height() > $(document).height() - 200) {
jQuery('.single-help').stop().animate({ bottom: '0px' });
$('.single-help').addClass('fixed_button');
}else{
$('.single-help').removeClass('fixed_button');
}
});
而这个CSS:
.fixed_button{
position:absolute !important;
margin-top:1900px;
bottom: 270px !important;
}
这不过去页脚内容停止DIV。但是,现在的问题。当我到达页面底部并向上滚动时,看起来代码jQuery('.single-help').stop().animate({ bottom: '0px' });
正在重复。该DIV single-help
跳转到300px
和左右动画回落到0px
。我不明白为什么会发生这种事。
有谁知道如何解决这个问题,或者告诉我更多关于这是为什么?我认为这可以做得更简单...谢谢。
我做了一个小提琴,我没有像我的网站一样工作,但它确实表明,当您滚动到顶部时,动画会重复两次。 https://jsfiddle.net/r31dnqm9/
什么是摆脱'.stop()'的结果? –
如果我删除了所有的stop(),它仍然会执行第二个动画。所以没有改变...(我删除了我的评论,因为我认为它的工作,但它没有)。 –
你可以创建一个jsfiddle吗? –