從iPhone優化頁面中移除水平移動/擺動

我正在嘗試優化iPhone的新聞頁面。我注意到的一個問題是我可以水平地點擊和移動頁面（即擺動）。從iPhone優化頁面中移除水平移動/擺動

我的問題是，我怎樣才能防止這種水平運動發生？

我們所有的新聞頁面都有這個問題。這裏有幾個例子：

2011-05-26 Ryan

在身體上添加「overflow-x：hidden」。

2011-05-27 04:23:56

-1

考慮從其他網站的想法，很多大網站都有一個移動網站。看看那些（我知道的唯一一個是facebook m.facebook.com），你可以看看css是如何完成的。可能的做法是％。我會建議去掉手機版的邊欄。應該取出大圖片或調整大小，以便瀏覽器沒有並排滾動條。

2011-05-26 18:23:25 Jung3o

我需要爲桌面和移動版本使用相同的HTML頁面。他們對iPhone進行優化的方式是在側邊欄上使用display：none。有一個更好的方法嗎？ – Ryan 2011-05-26 23:20:22

您可以嘗試設置user-scalable = 0;並看看是否有任何影響。

2011-05-26 18:28:22 jaminguy

感謝您的建議。不幸的是它仍然在水平滾動。你知道還有什麼我可以嘗試嗎？ – Ryan 2011-05-26 23:18:58

這聽起來像你的頁面元素之一是> 320px – jaminguy 2011-05-27 01:10:35

我無法弄清楚它是什麼。我試過刪除頁面中的所有內容。然後它歸結爲一個CSS文件，或jQuery，或我的視口元。每次我刪除一個修復它，但這些都是關鍵文件。我不確定是什麼原因造成的。 – Ryan 2011-05-27 23:17:42

東西肯定比您的設備寬度大。將以下內容添加到您的css中找到罪魁禍首。

* { border-style:solid; }

然後，您可以縮小設置border-color:red;個人類/標籤/ IDS搜索。

2011-09-06 09:37:37 JasonDScott

現在我明白了爲什麼會發生這種情況，我自己也無法找到答案，非常感謝 – 2015-05-29 12:55:33

'overflow-x：hidden'不適合我，但這很快找到了罪魁禍首，謝謝。 – 2016-01-19 16:14:33

這也發生在我身上，這是一個額外的關閉div標籤的結果。一旦我刪除額外的</div>，水平「擺動」不再發生。

2017-01-04 18:08:37 cschaefer

我也是，iPhone上的「搖擺」在網頁上。它最終由一個比它所在列寬度更寬的圖像引起（這是使用Twitter Bootstrap的行中的最後一列）。您可能會想到「明顯」，但很難發現圖像背景何時與頁面背景相匹配。

只是使圖像響應，或小於列寬 - 它解決了我。

2017-03-16 16:49:44

回答