attribute - html5 image tag



移動檢測網站的特定部分 (2)

我是網絡開發的初學者,在遇到這個問題時遇到了麻煩。

我已經拍攝了一個視頻,並將其編碼成一個mp4文件和一個ism文件。 我有兩個不同的視頻標籤 - 一個將播放每個文件。 對於我正在處理的網站,如果在移動設備上查看網站,我希望使用其中的一個視頻代碼,如果不是,則另一個。 目前該網站是在HTML5中。 感謝您的幫助!

https://src-bin.com


Answer #1

視頻標籤已經支持備用來源。 這裡的文章介紹瞭如何包含多個視頻源(因為某些瀏覽器不能使用某些編解碼器)。 像這樣:

<video width="320" height="240" controls>
  <source src="movie.mp4" type="video/mp4">
  <source src="movie.ogg" type="video/ogg">
Your browser does not support the video tag.
</video>

對於移動檢查,您可以使用JavaScript CSS媒體查詢:

function isMobile() {
    return window.matchMedia( "(max-width: 320px)" );
}

看到這篇文章


Answer #2

您可以使用基於UserAgent的檢測來決定要顯示的內容(不建議您必須維護它)或canPlayType()與您使用的編解碼器來查看瀏覽器是否支持它(更好的選項)





detection