移動設備上的視口高度

Question

所以我有一些真正的麻煩試圖設計一個響應式網站。問題來自於我使用的vh單元，它將我的一些div設置爲視口高度的100％。

雖然這適用於臺式機完全正常，我的問題是，在移動視實際改變：

• 當你向下滾動導航欄（鉻例如）消失，使視高。發生這種情況時，基於vh單元的div會重新調整並使所有內容都滑動一點（當您向下滾動時，這看起來不太好看）。
• 如果你想回到你錯過的東西上，滾動使導航欄再次出現，並且一切都以另一種方式再次滑動。

所以，基本上，如果用戶在我的網站上下滑動，這個問題會讓它的體驗方式比它應該更差。

是否有任何解決方案允許我設置我的div太滿的視區尺寸而不允許調整大小/適應調整大小的東西？

Answer 1

好的。我們來解決這個問題。在這種情況下我只知道兩種解決方案。

• 簡單地說有 「髒」 的黑客。當導航欄消失時，意味着視口的高度變得更高。你可以簡單地用css3真棒過渡動畫:) transition: height 1000000000000000s。誰將會如此位於頁面上以查看它？ ）
• JavaScript。在頁面加載檢查視口之前（JavaScript通過導航欄獲得高度），爲所有塊設置固定高度。