使用animate-scrollTo时jQuery闪烁

2020/12/31 21:51 · jquery ·  · 0评论

scrollTojQueryanimate函数调用函数时,我遇到了问题

这是我的代码:

$("#button").click(function(){
    $("body").animate({scrollTop: 1400},"slow");
});

当我单击按钮时,闪烁出现在主体滚动之前。例如,我处于(滚动位置)1000,单击按钮时发生以下情况:

  1. 出现(滚动位置)1400上的页面/图像,好像我已经去过(位置)1400
  2. 然后它再次移动到(位置)1000,这发生得非常快,看起来像是闪烁的
  3. 最后,它像普通的纸卷一样滚动到1400。

在Firefox上,它总是出现,有时在chrome上。

我有同样的闪烁问题。这是由触发函数的链接中的哈希锚引起的。使用preventDefault()修复了该问题:

$("#button").click(function(e){
    e.preventDefault();
    $("body").animate({scrollTop: 1400},"slow");
});
<a href="#" onclick="return scrollFromTop(1400, 2000);">scroll</a>

function scrollFromTop(offset, duration) {
    $('body').stop(true).animate({scrollTop: offset}, duration);
    return false;
});

有同样的问题...通过在点击处理程序上返回false修复了该问题

通过停止动画来解决此问题,如下所示:

$('body,html').bind('scroll mousedown wheel DOMMouseScroll mousewheel keyup touchmove', function(e){
            if ( e.which > 0 || e.type == "mousedown" || e.type == "mousewheel" || e.type == "touchmove"){
                $("html,body").stop();
            }
        })

在那里找到:当用户手动滚动时,jQuery .animate()停止滚动?

本文地址:http://jquery.askforanswer.com/shiyonganimate-scrolltoshijqueryshanshuo.html
文章标签: ,   ,  
版权声明:本文为原创文章,版权归 admin 所有,欢迎分享本文,转载请保留出处!

文件下载

老薛主机终身7折优惠码boke112

上一篇:
下一篇:

评论已关闭!