【发布时间】:2015-09-25 22:43:42
【问题描述】:
我有一个返回顶部按钮,当您滚动一点时会出现。它工作正常,但是当滚动到页脚时,我希望按钮位于页脚上方。
当我到达页面底部时,我使用jquery animate 方法来更改按钮的bottom css 规则。但是这种效果不会立即在我的网站上发生,因为我有更多的javascript,我认为它需要在运行效果之前遍历所有代码并且它无法正常工作。
问题出在哪里? .这是我所做的:JSFIDDLE
var offset = 250;
var duration = 500;
$(window).scroll(function () {
if ($(this).scrollTop() > offset) {
$('.back-to-top').fadeIn(duration);
} else {
$('.back-to-top').fadeOut(duration);
}
});
$('.back-to-top').on('click', function () {
event.preventDefault();
$('html,body').animate({ scrollTop: 0 }, duration);
return false;
});
$(window).scroll(function () {
if ($(window).scrollTop() + $(window).height() == $(document).height()) {
$('.back-to-top').animate({ 'bottom': '400px' });
} else $('.back-to-top').animate({ 'bottom': '10%' });
});
【问题讨论】:
标签: javascript jquery html scroll jquery-animate