Ted Talk HTML5字幕視頻

我注意到，在特德會談中，當嵌入視頻閃光時，如果您選擇擁有它們，則會有字幕。但是，html5版本沒有。我想知道是否有任何方法可以使這項工作。現在我有了一個在lightbox中打開的iframe。Ted Talk HTML5字幕視頻

我能想到的一個hacky fix有一個浮動div，它改變了基於JSON字幕文件的文本（例如：http://www.ted.com/talks/subtitles/id/70/lang/pt），但是......如果有更好的解決方案，我很想知道它。但是如果有人知道如何實施hacky fix，那也會很棒。

謝謝:)

來源

2013-07-19 user2494251

Here is an article描述如何開始與軌道元素，你可以用它來添加字幕或說明。

編輯：構建一個包含您的HTML5視頻和曲目標記的單獨文件，然後將其作爲iframe源引用。

<html> 
<head> 
</head> 
<body> 


<iframe width="560" height="315" frameborder="0" src="YOUR_HTML5_VIDEO_PLUS_TRACK"></iframe> 

</body> 
</html>

然後，你.vtt文件看起來像：

railroad 
00:00:10.000 --> 00:00:12.500 
Left uninspired by the crust of railroad earth 

manuscript 
00:00:13.200 --> 00:00:16.900 
that touched the lead to the pages of your manuscript.

你可以在任何文本編輯器這個.vtt文件，更改文件擴展名。您需要在網絡服務器上託管它，它不會在本地工作（例如，src = file：//）

來源

2013-07-19 21:31:10 Phoenix

我仍然想要使用他們的視頻播放器（出於合法原因）。這會繼續嗎？他們讓我們嵌入一個iframe我認爲 – user2494251

它應該工作，因爲您定義什麼視頻源與實現Track元素分開。你甚至應該可以使用相同的iframe，並在其中設置javascript提示。我沒有測試過，但我認爲這會起作用。 – Phoenix

你認爲你可以粘貼一個例子嗎？我是JavaScript新手，我不確定你的意思。 – user2494251

Ted Talk HTML5字幕視頻

回答

相關問題