2010-09-09 29 views
11

我正在研究一個Web應用程序的細節,這個應用程序涉及到一系列(很短的)視頻剪輯的一系列連續加載,偶爾會有用戶建立輸入視頻剪輯的新方向。我可以預加載多個視頻資源以加載相同的HTML5 <video>元素嗎?

我希望能夠讓瀏覽器一次預加載五個視頻剪輯。但是,我們目前擁有該網站的方式是通過一個視頻元素來實現的,該元素通過JavaScript不斷更新其src屬性。

有沒有一種簡單的方法可以使瀏覽器預加載多個視頻剪輯,即使我最終將它們全部(一次一個)加載到相同的視頻元素中?

+4

很好措辭,很清楚。歡迎來到堆棧溢出! – 2010-09-10 11:16:43

+0

謝謝!我不確定這個問題太模糊或一般。 – Sergio1132 2010-09-11 19:03:27

+0

我正在嘗試做類似的事情,我想我可能會接近。這個API真的有助於看到內部工作和如何使用它們當我完成後發回 – 2012-01-06 20:13:29

回答

3

通過在JavaScript中創建<img>標記並設置其src屬性,可以在瀏覽器中預加載圖像。雖然它不是任何規範所要求的,但所有瀏覽器都會下載並緩存它(假設它們的緩存沒有被禁用)。

我不知道它是否適用於HTML5中的<video>元素,但它可以。你可以放棄嗎?

+0

我試過類似的東西,但我的問題是,該網頁設計爲只有一個

+0

我應該解釋說,問題中的視頻元素基本上是整個頁面。我想我需要一種方法告訴瀏覽器抓取一組文件並緩存它們,直到將它們一次加載到視頻元素中。我需要它在JavaScript中發生,因爲所需的文件根據用戶輸入而改變。 – Sergio1132 2010-09-11 19:01:05

+2

@ Sergio1132:啊,所以瀏覽器似乎沒有緩存視頻文件。在這種情況下,我認爲你必須改變你的方法 - 創建另外的'

-1

如果您碰巧完成了您正在進行的項目,我很好奇嗎?我正在試驗一個帶有播放列表的html5視頻播放器,並在想如果遇到任何大問題。在加載/播放多個視頻文件時是否存在性能問題?你是否可以在iPad上運行它?你有一個回退IE瀏覽器?

我的方法是:單個<canvas>元素具有多個隱藏的<video>元素,並使用canvas drawImage()函數在視頻之間顯示和交叉淡入淡出。