桌面上的視頻背景，移動圖片可能嗎？

Question

我想寫一個網站，在桌面視圖上有一個視頻背景（這已經是inplace和功能）;但在移動設備上加載時會顯示圖像。

<div class="main">  
    <video autoplay muted loop> 
    <source src="Main-Stream.mp4" type="video/mp4"> 
    </video> 
    <div class="content container"> 
    <h1>Discover the Lifetarian Way</h1> 
    <a href="x" class="btn">Purchase the Book</a> 
    </div>    
</div> 

Answer 1

您可以使用媒體查詢來設置display: none到video元素。但是，媒體查詢僅用於確定頁面的大小，因此它們只能用作啓發式以確定數據是否確實很昂貴。

如果你想根據連接類型（手機/ wifi）做一些不同的事情，你需要類似navigator.connection API的東西，但這遠非標準。