嗨,我有一个“返回顶部”按钮,一旦浏览器滚动一定距离,该按钮就会淡入并呈现动画。问题是每次浏览器被滚动时它都会一次又一次地重复 .animate() 。有什么想法如何在动画发生一次后停止它吗?干杯
这是代码:
$('.up_arrow').hide();
// fade in up arrow
$(function () {
$(window).scroll(function () {
if ($(this).scrollTop() > 100) {
$('.up_arrow').fadeIn(2000, 'swing')
.animate ({
opacity: 1,
left: '+=30'
},
{
duration: '2000',
easing: 'swing',
queue: false
}
);
} else {
$('.up_arrow').fadeOut(2000, 'swing');
}
});
});
最佳答案
$(function () {
var stop = false;
$(window).scroll(function () {
if ($(this).scrollTop() > 100 && stop == false) {
$('.up_arrow').fadeIn(2000, 'swing')
.animate({
opacity: 1,
left: '+=30'
}, {
duration: '2000',
easing: 'swing',
queue: false
});
stop = true;
} else {
$('.up_arrow').fadeOut(2000, 'swing');
stop = false;
}
});
});
关于jquery .animate() 在滚动时一遍又一遍地重复,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/10571914/