如何將視頻和播放列表添加到使用HTML5的頁面中？

我一直在使用帶有播放列表選項的基於Flash的JWPlayer 4。最近我升級到JWPlayer 5，它聲稱支持HTML5。播放器本身在支持HTML5但不支持閃存的移動設備上很好地降級，但是它隨着播放列表選項的啓用而中斷。如何將視頻和播放列表添加到使用HTML5的頁面中？

那麼有人可以告訴我，我在做什麼錯誤的JWPlayer 5，以及如何讓它與移動設備的播放列表選項，或者只是教我一個更好的方式來設置視頻和播放列表與HTML5？

資源的JWPlayer和播放列表佈局的

JW Player and playlist configuration example page
實施例：

screenshot-with-shadow.jpg http://img198.imageshack.us/img198/5788/screenshotwithshadow.jpg

來源

2011-11-07 cwd

這不是關於嵌入式系統編程紛至沓來。重新標記。 –

您應該向[JWPlayer開發人員]（http://www.longtailvideo.com/support/）尋求支持。 [This]（http://www.longtailvideo.com/support/forums/jw-player/player-development-and-customization/17300/jw-54-html5-ipad-compatibility-control-bar-playlist）可能是很有幫助。 – ExpExc

你的設置是什麼？ –

JWPlayer的最新版本也支持HTML5播放。現在它也可以用於不支持閃存的移動設備。

另一個HTML5視頻播放器，Flash後備是videoJS（http://videojs.com/）

來源

2011-11-08 12:49:53 Variant

您是否閱讀過該問題？你的第一句話讓我覺得沒有。你的第二句話很有幫助。 – cwd

其實我開始......然後直接跳到問題 – Variant

這不回答你的主要問題。這只是一些一般的提示。

升級。我在5.6沒有在移動設備上播放時遇到了一些麻煩，並且升級到5.8以修復它。
此刻請避免自動播放。我在播放器沒有加載時遇到了一些問題。這可能是由於加載大型媒體文件的時間問題，以及JavaScript試圖開始播放。另外，對於連接速度較慢的Linux用戶（例如3mb dsl），當播放頭接通，緩衝區爲空時，播放器停止運行。
也許覆蓋模式。對於我的媒體來說，html5看起來好一點。

模式：[ {類型：「HTML5」}，{ 類型：「閃」，SRC：「/media/player.swf」} ]
嘗試使用相同的高度/寬度作爲你的媒體。
如果您只播放音頻 - 如果您的寬度較大，則很難找到（居中）播放按鈕。
我沒有使用播放列表。我有一個頁面上的錄音列表，以及一個加載彈出/對話框的按鈕。

來源

2011-11-16 18:32:27

這不是JW Player的具體答案。

如果您替換標記，瀏覽器的原生HTML視頻標記行爲會很奇怪。相反，您應該直接在標籤中設置單個src屬性。通過這種方式，您可以在DOM中更改該屬性。在更改之前，請先嚐試暫停播放的視頻。

我使用mediaelementjs.com。它工作得很好。

它沒有內置播放列表功能，但您可以輕鬆地自行構建。畢竟，播放列表只是一個視頻列表，當你點擊一個視頻時，你可以更改視頻的來源。

媒體元素具有支持HTML5和閃回回退的setSrc（）函數。它適用於我。

來源

2011-11-17 06:28:21

如果你可以給出一個很棒的實現例子。 – cwd

dev-moeam -dot- hardwarezone -dot- com/videogallerys 將每張幻燈片視爲播放列表的不同軌道。您正在尋找videog.js中的launch_video_player功能。 –

+1推薦mediaelementjs.com – Teddy

這些鏈接可能會有所幫助：

來源

2011-11-17 10:41:12 sepulchered

鏈接很有幫助 - 謝謝。對他人的說明 - PagePlayer僅用於音頻，而您提供的JW Player 5鏈接無法將視頻加載到iPad上。 – cwd

如果你只是使用YouTube視頻，他們提供了一個（測試版）HTML5視頻播放器：http://code.google.com/intl/en/apis/youtube/iframe_api_reference.html

我使用本網站上的HTML5視頻播放器：IE的http://www2.highpoint.edu

和舊版本不能使用播放器（非常好），所以我仍然使用這些瀏覽器，而不是被通過YouTube完成的Flash嵌入標籤JS API：http://code.google.com/intl/en/apis/youtube/js_api_reference.html

下面是一個例子頁：http://www2.highpoint.edu/youtube.php?id=ht1PrQkE3WU

我強烈建議mediaelementjs如果您需要推出你自己的視頻播放器。所有網站上的視頻是由YouTube託管的，但我們仍然把它作爲一個音頻播放器，如下所示：http://www2.highpoint.edu/president.php?mp3=http%3A%2F%2Fwww2.highpoint.edu%2Fmp3%2FNQ_LI013107.mp3

來源

2011-11-17 20:48:29 Teddy

謝謝。我是否錯過任何這些鏈接上的播放列表？沒有看到一個。 – cwd

在我的示例中沒有播放列表，但YouTube在此處記錄了它：http://code.google.com/intl/zh-CN/apis/youtube/player_parameters.html?playerVersion=HTML5#playlist和http://code.google。 com/intl/en/apis/youtube/js_api_reference.html＃loadPlaylist – Teddy

mediaelementjs會讓你綁定到'ended'事件，你可以使用它來編寫自己的播放列表代碼：http://mediaelementjs.com/#api – Teddy

SWF不被移動設備所支持

我認爲這是有用的，但需要兩個類型的文件

<video width="320" height="240" controls="controls"> 
    <source src="movie.mp4" type="video/mp4" /> <!-- for iPad :) --> 
    <source src="movie.ogg" type="video/ogg" /> <!--for windows --> 
    Your browser does not support the video tag. 
</video>

和我嘗試javascript來改變電影，它在這兩個

工作，你必須使用這個，因爲我有一個iPad，我不能打開該SWF基於視頻播放器的視頻

來源

2011-11-17 21:25:01

瞧未回合德腳本jwplayer 6.7等播放的YouTube

<script> 
jwplayer("myElement").setup({ 
    width: "100%", 
    height: "400", 
    playlist: "http://gdata.youtube.com/feeds/api/playlists/PLMIePZMXPqnYlsvE_PFwe-_e336HlJF7g?max-results=50&alt=rss", 
    stretching: "exactfit", 
    primary: "flash", 
    sharing: {link: "http://www.centraltv.fr/egypte-television/rotana-masriya"}, 
    autostart: "true", 
    listbar: { 
    position: "right", 
    size: "220" 
    } 
}); 
</script>

來源

2014-01-24 14:52:03 Ctv

如何將視頻和播放列表添加到使用HTML5的頁面中？

回答

相關問題