從加載禁用HTML 5視頻

我有一個設置，根據當前天氣情況顯示背景視頻，如下所示：http://pitfarmtennis.co.uk/cms/。從加載禁用HTML 5視頻

有6個不同的視頻，目前jQuery代碼來決定哪些顯示只是設置它們顯示：無，這可悲意味着所有這些仍然加載。

這是目前正在某個視頻播放jQuery的，在這種情況下，一個陽光明媚的視頻：

/*Day-sun*/ 
    if((weather.code == "28")||(weather.code == "30")||(weather.code == "44")) { 
     $('.home-bg-sun').css("display","inline"); 
    }

一個解決方案，我曾嘗試是將所有的SRC在HTML數據屬性-src，然後改變相關的一個SRC火的視頻，這沒有奏效到今天爲止，但我可能做錯：

的jQuery：

/*Day-sun*/ 
    if((weather.code == "28")||(weather.code == "30")||(weather.code == "44")) { 
     $('.home-bg-sun').attr('src', $('.home-bg-sun').attr('data-src')); 
    }

HTML：

<div class="home-bg-sun"> 
    <video class="home-bg-sun-video" autoplay loop poster="wp-content/themes/eddiemachado-bones-9db85e4/library/images/home-bg-sun-first_frame.jpg"> 
     <source id="home-bg-sun-video-source" src="wp-content/themes/eddiemachado-bones-9db85e4/library/videos/home-bg-sun.webm" type="video/webm"> 
     <source id="home-bg-sun-video-source" src="wp-content/themes/eddiemachado-bones-9db85e4/library/videos/home-bg-sun.mp4" type="video/mp4"> 
    </video> 
</div>

任何幫助將不勝感激！

PS：我使用雅虎天氣來獲取天氣狀況。

來源

2015-09-04 hardanger

有視頻元素上preload屬性。
您可能需要嘗試metadata或none的值。

但請注意，此屬性僅僅是瀏覽器的提示，並不是強制遵循它。

來源

2015-09-04 11:26:45 Kaiido

謝謝@Kaiido。我試圖測試這個，我添加這段代碼試圖讓視頻停止加載： $（「＃home-bg-sun-video-source」）。attr（「autoplay」，「false」）; （「＃home-bg-sun-video-source」）。attr（「preload」，「none」）; 但它不工作！視頻仍然顯示 - 我的jQuery不正確？ – hardanger

爲什麼不直接在html上設置它？ 'autoplay'默認設置爲false，你不需要它。是的，你的代碼是錯誤的，這些屬性應該設置爲視頻元素（'$（「＃home-bg-sun-video」）'） – Kaiido

謝謝 - 這可以工作，但視頻在自動播放和預加載關閉時仍然加載看來，他們只是不顯示。因此，我嘗試在「＃home-bg-sun-video-source」元素上設置src屬性，但我似乎無法引用它！以這種方式設置src時，視頻從不加載。請有任何想法嗎？ – hardanger

你可以嘗試刪除從隱藏的視頻「自動播放」屬性，並重構你的超像：

來源

2015-09-04 10:54:12

感謝您的回覆。我剛剛測試了您的解決方案，但不幸的是，視頻仍在加載，他們只是不玩。我的目標是防止視頻不必要的加載。 – hardanger

也許你應該嘗試多個視頻標籤與單一來源對方？ –

對不起@ user5285659，請您詳細說明一下嗎？不明白你的意思。 – hardanger

從加載禁用HTML 5視頻

回答

相關問題