iOS上的JQuery Mobile滾動不暢通

我有一個用JQuery 1.4編寫的多頁面應用程序，顯示在iOS WebView中。它使用一個靜態頭，內容有20個左右的div，嵌入圖像和文本。我沒有使用PhoneGap。iOS上的JQuery Mobile滾動不暢通

在Safari中的WebView 和中，我可以垂直滾動瀏覽內容，但我沒有獲得與iOS應用程序相同的平滑度（即在手指彈出後滾動持續了一會兒=「平滑」滾動）。當我的手指離開屏幕時，滾動停止。

是否有一個設置或問題我不知道什麼時候能夠順利滾動JQuery Mobile中的內容？

來源

2014-01-18 dixkin

也許問題在於它需要大量的處理能力來繪製這些圖像/ div。你壓縮了你的文件嗎？

你可以在這裏閱讀更多：

圖像壓縮 http://www.html5rocks.com/en/tutorials/speed/img-compression/ **滾動到底部的應用程式的連結則可以使用

CSS漆時報導致問題 http://www.html5rocks.com/en/tutorials/speed/css-paint-times/ **請務必點擊底部的「連續塗料時間」鏈接，瞭解如何繪製塗料時間。

希望這會有所幫助！

來源

2014-01-18 00:45:15 dustinhorn

感謝，也許這就是問題所在，但就好了，只要我的手指上下滾動實際工作 - 沒有抖動或任何東西。問題是刷卡後 - 滾動只是停止和不遵循刷卡的勢頭（像它對於大多數本土滾動視圖）。 – dixkin

你可以嘗試使用戴維·泰勒的jQuery的動態庫來添加一些滾動活動容器： http://davetayls.me/jquery.kinetic/

來源

2014-02-04 01:19:52 user3011237

我認爲這與事實，你不再滾動<body>元素做，而是JQuery Mobile頁面<div>。如果您在沒有JQuery Mobile的情況下滾動<div>，則應該可以複製這種不連貫的體驗。

你在找什麼實際上是所謂勢頭滾動，有時也被稱爲慣性滾動。

假設你應該可以將css屬性-webkit-overflow-scrolling: touch;添加到你想添加動量滾動的div並且它應該可以工作，但是我一直沒有能夠得到這個工作在Page <div>上。我確實嘗試將它添加到body中，並且我能夠正確地滾動，但是當我滾動時，我的固定標題開始跳動。

如果您沒有固定的標題，請隨時嘗試一下。

body { 
    -webkit-overflow-scrolling: touch;  
}

來源

2014-03-14 07:45:02

所以在我的情況下，我有其他人在應用程序上工作，他們把一個糟糕的CSS規則，導致這種不好的經歷。我通過剝離除JQuery Mobile CSS之外的所有CSS來發現此問題。然後我慢慢地添加了自定義CSS的其餘部分，直到找到壞規則。這非常令人沮喪，但是由於多個人在同一個項目上工作的結果。我之所以首先認爲它是JQuery Mobile，是因爲我也嘗試刪除JQuery Mobile，沒有它，應用程序運行良好。所以我猜這兩條規則是競爭的。 –

冠軍！這幫助了很多。 –

對我來說也有幫助。謝謝你斯科特！你能另外告訴我們，你在你的項目中被認定爲「壞規則」嗎？ – marcel

您可以使用nicescroll插件，它可以在許多平臺上使用。

安裝：

<script src="jquery.nicescroll.js"></script>

用法：

$(document).ready(

    function() { 

    $("html").niceScroll(); 

    } 

);

這裏是nicescroll plugin

來源

2014-09-18 06:35:18

對我們的參考，這個問題是jQuery Mobile的的CSS和我們像這樣修復它：

.ui-mobile .ui-page-active{display:block;overflow:visible;/*overflow-x:hidden*/}

固定滾動錯誤我們。

overflow-x: hidden把事情搞亂。

來源

2015-04-15 09:12:13 EpicPandaForce

大家都有這個問題，先試試這個吧！ – leymannx

對我而言，此方法有效。謝謝。 –

iOS上的JQuery Mobile滾動不暢通

回答

相關問題