jQuery的动画滚动而不$ .browser与不点火两次

我发现关于$('html, body').animate();交叉鲍泽行为的许多问题，但由于某些原因，我无法找到这个答案：

我想（最终）删除$.browser，但在同一时刻，不想滚动事件再次触发两次，这将在某些浏览器中发生，如果选择是$('html, body)

// animte page scrolling 
pageScroll : function(scrollTo, speed, callback) { 

    var rootElem; 

    scrollTo = scrollTo || 0; 
    speed = speed || 800; 

    if ($.browser.webkit) { 
     rootElem = $('body'); 
    } else { 
     rootElem = $('html'); 
    } 

    rootElem 
     .stop() 
     .animate(
      { 
       scrollTop: scrollTo 
      }, speed, callback 
     ); 
}

来源

2015-04-13 retrovertigo

需求是什么？ – guest271314

在例如页面部分而不触发事件两次;更新我的示例代码，希望更清楚 – retrovertigo

哪些浏览器在$（'html，body'）上导致双重触发？ – frenchie

我看着这个相当长的一段并没有找到一个真正的解决方案，除了检查文档就绪：

http://codepen.io/anon/pen/yyddER?editors=011

var mainelement; 

$('html, body').animate({scrollTop: 1}, 1, function() { 

if ($('html').scrollTop()) mainelement = $('html'); // FF and IE 
if ($('body').scrollTop()) mainelement = $('body'); // Chrome, Safari and Opera 
mainelement.scrollTop(0); 
});

假设这里的含量足够高，以创建一个滚动条...

测试的主要浏览器，并顺利运作。

编辑 - 的变化，以确保如果浏览器使用<html>为溢出的主要元素触发滚动页面背面只在一个单一的时间采取行动：

var mainelement, tested = false; 

$('html, body').animate({scrollTop: 1}, 1, function() { 

if ($('html').scrollTop()) mainelement = $('html'); 
else if ($('body').scrollTop()) mainelement = $('body'); 

if (!tested) { 
tested = true; 
mainelement.scrollTop(0); 
} 
});

++++++ ++++++++++++++++++++++++++++++++++++++++++++++++++ +++++++++++++++++

后来想出了这种做法以及（这似乎是最有效的）：

http://codepen.io/anon/pen/NPQNEr?editors=001

var mainelement; 

$(window).scrollTop(1); 
if ($('html').scrollTop()) mainelement = $('html'); 
else if ($('body').scrollTop()) mainelement = $('body'); 
mainelement.scrollTop(0);

来源

2015-04-13 01:29:33 Shikkediel

谢谢，但它似乎并没有与我的参数'速度'和'回调' – retrovertigo

你可能发布组合代码呢？必须是一个细节，不能认为它不起作用的原因。为了完整性在答案中增加了一支笔。 – Shikkediel

谢谢。我根据你的例子修改了我的代码，并创建了一个测试用例：http://codepen.io/scheinercc/pen/NPQxBm - 看看'test animation''在IE中如何记录两次，但'实际动画'将永远只会被记录一次，因为我设置了一个额外的标志。这是一个比以前更复杂的“$ .browser”，但它似乎工作 – retrovertigo

这是我在生产中使用的代码;工作得很好：

function ScrollPage(TheTop) { 

    TheTop = parseInt(TheTop, 10); 

    if (!$.isNumeric(TheTop)) { 

     return; 
    } 

    $('html,body').animate({ scrollTop: TheTop }, 400); 
}

如果问题是事件处理程序射击两次，然后表示该功能被称为莫名其妙地两次，该Bug因此别处。另一方面，$.browser()函数已被弃用一段时间。

来源

2015-04-13 01:33:39 frenchie

我认为这就是要点 - 删除'$ .browser'因为它已被弃用了一段时间。你指的是什么事件处理程序？当使用'$（'html，body'）'时，显然有两个元素被定位。浏览器计算两者（我测试过），即使其中一个不用于动画。 – Shikkediel

是的，@Shikkediel已经给我很多答案了。我想记住例如IE同时触发'html'和'body'元素。 – retrovertigo

jQuery的动画滚动而不$ .browser与不点火两次

回答

相关问题