Safari中的視頻背景HTML5

Question

我正在幫助一個網站，我們希望在網站登陸時擁有視頻背景。

它在Google Chrome上運行得很好，但它在Safari上無法正常工作。

這裏是網站（請與Chrome和Safari比較吧）：http://tinyurl.com/nbe8rzy

HTML對於視頻：

<video autoplay loop poster="polina.jpg" id="bgvid"> 
    <source src="<?php bloginfo('template_url'); ?>/assets/img/video1.mp4" type="video/mp4"> 
</video> 

CSS視頻：

video#bgvid { 
position: fixed; right: 0; bottom: 0; 
min-width: 100%; min-height: 100%; 
background-size: cover; 
z-index: 1; } 

我使用的是固定的在視頻上使用z-index 1的位置，在其餘div上使用較高的z-index的相對定位，然後是1（因此視頻保留在背景中）。在Safari

問題：

1. 視頻streching延遲
2. 其他申報單並不顯示

問題：

1. 我怎樣才能解決這個問題？ （代碼/鏈接/幫助非常感謝！）
2. 是否有可能使用移動視頻背景/ ipad？還是應該回退到圖像？

Answer 1

更新您的視頻背景div來

#yourvideobackground { 
    position: absolute; 
    top: 0px; 
    left: 0px; 
    min-width: 100%; 
    min-height: 100%; 
    width: auto; 
    height: auto; 
    z-index: -1000; 
    overflow: hidden; 
} 

要解決，而且對大多數瀏覽器包括Safari的視頻作品，你將不得不給它一個絕對位置，並設置它的Z -index低於它上面的所有其他元素。

您不能使用background-size屬性，也不能使用視頻。

如果你想要在另一個div的內部，確保父div有一個相對位置設置。

如果你不想走那條路線，你可以使用一個漂亮的插件，我已經取得了成功。

https://github.com/Victa/HTML5-Background-Video

祝你好運！