如何更好地過渡<video>背景在css

我有一個10秒的視頻作爲我的網頁在我的網頁使用純CSS只。這裏是我的代碼：如何更好地過渡<video>背景在css

<style> 
    video#bgvid { 
position: fixed; right: 0; bottom: 0; 
min-width: 100%; min-height: 100%; 
width: auto; height: auto; z-index: -100; 
background: url(polina.jpg) no-repeat; 
background-size: cover; 
       } 
</style> 
<body> 
    <video autoplay loop poster="polina.jpg" id="bgvid"> 
     <source src="vidwallpaper.mp4" type="video/webm" /> 
     <source src="vidwallpaper.mp4" type="video/mp4 " /> 
    </video> 
</body>

當我10秒視頻播放結束後，視頻重複，從一開始，它開始是沒有吸引力的眼睛回來的路上，因爲視頻和起點的結尾部分視頻點沒有連接好。

有沒有一種方法可以讓我的過渡像衰落效應一樣，這樣我的壁紙循環會更好？ tia

來源

2015-03-19 Dale

看起來你有一個錯誤的類型是視頻/ webM你應該有一個文件擴展名（webm） – 2015-03-19 10:00:49

其實，我沒有一個錯誤，我只是想做一個更好的過渡/重複我的視頻壁紙。 – Dale 2015-03-19 10:02:57

通常的解決方案是編輯視頻，以便端到端轉換看起來更平滑。不幸的是，在某些瀏覽器上，它可能會在重新啓動之前暫停一秒。

請參閱this and related questions。

要進行交叉淡入淡出，您需要兩個視頻或兩個包含相同視頻的視頻元素。你會有一場比賽，在比賽結束前不久，開始另一場比賽。你會在另一個視頻前面看到一個視頻，然後逐漸改變前一個視頻的不透明度以進行交叉淡入淡出。然後，您可以倒帶不可見的視頻，以便爲下一次轉換做好準備。

來源

2015-03-20 21:39:44 aldel

如何更好地過渡<video>背景在css

回答

相關問題