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與不點火兩次

回答

相關問題