帶有videoJS的嵌入式視頻 - Safari的尺寸問題

好吧我已經有了一些與Chrome完美結合的工具，但在Safari中它有點奇怪。帶有videoJS的嵌入式視頻 - Safari的尺寸問題

第一個視頻播放的很好，完全按照我的要求播放，但是在頁面的另一端我有另一個嵌入的視頻，儘管我使用的是相同的代碼，除了'autoplay'和視頻文件，當然，第二個是真的很大，似乎是雙倍的高度..

這就像它每次增加100％。

這是第一次一個

<video autoplay id="my_video_1" class="video-js vjs-default-skin" controls 
preload="auto" poster="../images/posters/1969.png" 
data-setup="{}"> 
<source src="../videos/1969.mp4" type='video/mp4'> 
<source src="../videos/1969.webm" type='video/webm'> 
</video>

，第二個

<video id="anothervideo" class="video-js vjs-default-skin" controls 
preload="auto" poster="../images/posters/1969.png" 
data-setup="{}"> 
<source src="../videos/video-2.mp4" type='video/mp4'> 
<source src="../videos/video-2.webm" type='video/webm'> 
</video>

認爲它可能是使用兩個相同的ID是造成問題的HTML，所以使用兩個獨立但沒有做任何事情，這裏的代碼的css

min-height: 100%; min-width: 100%; height: auto !important; width: auto !important;

不知道發生了什麼事情！

來源

2013-04-11 nickoreardon

你有一個可以鏈接到的工作示例嗎？ – Fernker 2013-04-11 17:47:12

http://www.oreardon.com/test/1969/index.html - 沒有得到那裏的視頻，但你明白我的意思，我也玩過幾件事，所以它有點改變了，它現在更大！ – nickoreardon 2013-04-11 18:13:05

該頁面上的每個部分（塊）對我來說看起來都很好。我在Chrome Dev：Mac上，每一個部分都和窗口一樣高而寬，沒有一個看起來比他們需要的更大或更小，那麼你是否能夠解決這個問題，還是仍然在發生？你是否使用？ – Fernker 2013-04-11 18:55:24

我錯過了它在Safari中的那一部分。但我有你的解決方案。所以它似乎是造成問題的最小高度。你可以做的是添加此CSS：

#my_video_2{ 
    min-height:inherit; 
}

看來，具有第二視頻引起的問題，但它是需要第一視頻才能正常顯示。

看看是否有效。

來源

2013-04-11 19:41:54 Fernker

它已經使它消失在一起，除非我做錯了什麼，我已更新該鏈接^^ 編輯：好吧，但有0px的高度 – nickoreardon 2013-04-11 19:48:18

我一直使用max-height：100％來加載它，但只要按下播放按鈕，視頻就會消失。令人沮喪！ – nickoreardon 2013-04-11 20:15:46

你將不得不繼續玩弄它，你正在對CSS做很大的改動（這對測試很有幫助），但是我不能跟上你現在正在做的事情， – Fernker 2013-04-11 20:19:51

帶有videoJS的嵌入式視頻 - Safari的尺寸問題

回答

相關問題