-2

我想要的全景背景是100％的高度，不管是什麼，我想，我似乎無法找出爲什麼它不起作用。任何人都可以用新鮮的眼睛看看源代碼，並讓我知道我錯過了什麼。

下面的代碼：

<script src="/vtour/tour.js"></script> 

<div id="pano" style="width:100%; height:100vh; overflow:hidden;"></div> 

<script> 
embedpano({swf:"vtour/tour.swf", xml:"vtour/tour.xml", target:"pano"}); 
</script>

移動100vh適用於桌面，但減免罰款。我寧願用高度：100％當我改變高度值，我得到的是一個白色的屏幕和調試工具顯示高度爲0像素

注：目前的設定爲97vh只是測試。但底部仍然有一個白色條。在手機上更糟糕。如果將其設置爲100vh，則會在移動設備上中斷並且導航按鈕消失。

來源

2017-08-23 Ricadam

請在您的帖子中添加[mcve]，而不是鏈接到網站。 – TylerH

'1vw'是瀏覽器寬度的1％，'1vh'是瀏覽器高度的1％，所以'height：100vh;'應該按照你想要的來做。 – Scoots

出於某種原因，移動100vh過沖，所以你必須滾動。 – Ricadam

`#pano`有這個

width: 100%; 
min-height: 97vh; 
height: 97vh;

如果你改變height: 97vh到height: 100vh這將是全高度

來源

2017-08-23 13:37:41

注意：它目前設置爲97vh，僅用於**測試**。但底部仍然有一個白色條。在手機上更糟糕。如果將其設置爲100vh，則會在移動設備上中斷並且導航按鈕消失。 – Ricadam

使用'height：calc（100vh - white barpx）;'@Ricadam –

在瀏覽器開發者工具檢查的#pano元素給了我這個。

width: 100%; 
min-height: 100vh; 
height: 97vh;

它看起來像在該元素上有一些內聯樣式給它的這些屬性。改變高度100vh。另外，在移動設備上使用vh會造成一些打擊，因爲當移動瀏覽器最初在頁面頂部開始時，瀏覽器url欄會出現，當你開始滾動時，url欄將消失，100VH的元素將立即嘗試填滿整個屏幕。如果你願意的話，這會導致看起來很差的「動畫」。

來源

2017-08-23 13:41:05

這是我的問題。我不想使用vh，因爲它在手機上打破了。這只是爲了測試審美。請參閱問題中的註釋。 – Ricadam

只需設置爲固定高度即可。您將不得不使用媒體查詢來覆蓋任何在移動設備上設置爲100vh的div。嘗試在em上設置高度，而不是在移動設備上。如果背景圖像佔據全部高度真的很重要，那麼你必須使用某種類型的其他方法，但那取決於你。 –

底部的導航按鈕連接到包含背景的div，如果背景未正確對齊，按鈕會在摺疊下重疊或消失。固定高度不實用 – Ricadam

確定，所以我想通這一個：

忘了佔頭（因爲它是透明的），所以我需要修改高度CSS：

height:calc(100vh - 30px)

問題解決了。

來源

2017-08-23 14:15:33 Ricadam

我不能讓這個DIV至100％的高度

回答

`#pano`有這個

我不能讓這個DIV至100％的高度

回答

#pano有這個

相關問題

`#pano`有這個