iPad + Jquery滾動工作一次，然後停止

我無法測試我的網站，因爲我沒有iPad，但我工作的人昨天去了一家蘋果商店嘗試一下，奇怪的行爲。iPad + Jquery滾動工作一次，然後停止

所以這是一個水平滾動網站，如果您點擊導航，它會使用jquery滾動到指向該鏈接的元素。在所有瀏覽器中都可以正常工作，在Firefox，Chrome或IE9中沒有控制檯錯誤。

雖然在iPad上的問題是，第一次點擊鏈接工作正常 - 它滾動，因爲它應該。但在此之後，點擊鏈接不再有效。他說它會移動幾個像素然後停止。

我簽署了保密協議，所以我不能顯示該網站，但這裏是我與導航綁定的代碼。這裏有什麼不對嗎？有沒有人在iPad上遇到這種問題？

$("#navhome, #logo").bind('click', function(event) { 
    // Home button and the page logo send you to the #home element 
    event.preventDefault(); 
    scrollToID($("#home"), this); 
}); 

function scrollToID(id, nav) { 
    $("html, body").stop(); 
    xtarget = id.position().left; 
    $("html, body").animate({scrollLeft: xtarget}, 'slow'); 
}

我的意思是，這似乎是這樣做的方式。爲什麼iPad會有麻煩？

我會繼續瀏覽谷歌現在，我不期望很多，但不能鏈接頁面。：/

來源

2011-11-15 Radley Sustaire

如果您使用Xcode打包應用程序，則可以在iPad模式下使用模擬器。 – Jasper

不具有建設性，但：無需爲ID選擇器提供上下文。'$（「＃navhome，#logo」）'可以縮寫爲'$（「＃navhome」）' – Blazemonger

沒有xcode，我希望我可以使用ipad和iphone模擬器。對於ID選擇器，這裏有一個逗號。我將單獨選擇#navhome和#logo作爲按鈕。他們都去同一個地方，但他們是單獨的按鈕。雖然 –

在收到具有類似問題的人的電子郵件後，回到此問題。

我遇到的問題是，我讓整個網站伸展了頁面的主體，這與iPad的觸摸控件（如滑動）一樣正常工作。但是，通過這樣做，我需要使用javascript（鋸齒形）或position：fixed（平滑但移動性不佳的支持）移動導航框。

然後在iOS5中出現一個錯誤，我仍然不確定原因，但它與通過jQuery動畫滾動並在移動過程中使用帶可點擊元素的移動div相關。

導航在動畫停止前將變得無法點擊，但有時即使在動畫之後，導航也將變得不可點擊，直到您通過滾動，縮放等與網站進行交互。顯然，此解決方法不方便用戶使用。

我的最終解決方案是將內容封裝在尺寸與瀏覽器寬度相同的div中。正如你可能知道的那樣，iPad和類似的觸摸設備沒有滾動div的本地觸摸支持，只是有限的滾動。

在某處可能有更好的解決方案，但現在，我們只是將它包裝在一個div中，以便我們的導航根本不必移動。只有我們的內容移動，包含在其內部。

來源

2012-01-04 04:41:18

你能發表更多的代碼嗎？你的例子似乎在我的iPad上適合我。

http://jsfiddle.net/DzyYT/

http://jsfiddle.net/DzyYT/show（爲iPad用戶）

我注意到一個錯誤。當使用滑動橫向滾動時，它會隨着動量而移動。如果點擊返回主頁按鈕後屏幕仍然滑動，則不起作用。

來源

2011-11-15 22:21:41 mrtsherman

非常感謝您的測試，但至少可以聽到該功能的作用。我在這個腳本中發現了一個不一致的地方，儘管我不確定它是否有bug。我所有的其他導航腳本都使用.stop（true，false），以便清除動畫隊列。 iPad只是使用.stop（）。因爲我不是測試ipad的人，所以我不確定它是否移動是因爲它排隊錯了也許他雙擊第一個鏈接，或者可能是觸摸事件計數兩次。我不知道，在嘗試解決它之前，我必須再試一次。 –

我在當前問題中添加了當前的解決方案，認爲我應該用評論更新您的答案。您測試的原因沒有我描述的問題，這是由於iOS5中的錯誤。您可能已經使用過第一代ipad，或類似於較舊的iOS版本。 –

iPad + Jquery滾動工作一次，然後停止

回答

相關問題