Как можно вставить видео на YouTube и поставить в очередь видео Vimeo, чтобы заменить его, когда закончится первый? - PullRequest
Новая
       42

Как можно вставить видео на YouTube и поставить в очередь видео Vimeo, чтобы заменить его, когда закончится первый?

0 голосов
/ 31 августа 2011

Конкретные видео сайты только для примера.Но мне любопытно, как можно ставить в очередь другое видео после первого финиша, с того же сайта или иным образом.По сути, это специальный плейлист.

Учитывая последовательность видео ссылок, как их можно объединить в один плейлист?

1 Ответ

1 голос
/ 31 августа 2011

JavaScript это путь сюда. Когда заканчивается одно видео, JavaScript должен изменить значения для нового встраивания. Поскольку Vimeo и YouTube используют одинаковые методы встраивания (iframes), это значительно упрощает жизнь.

Когда заканчивается одно видео (подробнее об этом в конце этого поста), используйте JavaScript для изменения атрибута SRC в вашем фрейме. Вы также можете изменить ширину и высоту по необходимости.

Пример: 

<iframe id="ourVideo" width="400" height="225" src="http://player.vimeo.com/video/28023982?title=0&amp;byline=0&amp;portrait=0" frameborder="0"></iframe>

Затем в JavaScript 

var newHTML = "http://www.youtube.com/embed/ZnehCBoYLbc?rel=0";
document.getElementById("ourVideo").setAttribute( "src", newHTML );

Я создал новую переменную для нового HTML, но вы можете извлекать ее из любого места. Использование таких фреймворков, как jQuery , значительно упрощает жизнь: 

$("#ourVideo").attr( "src", newHTML );

Если вам нужна функциональность плейлиста, я бы рекомендовал заполнить массив в JavaScript, а затем повторить: 

var playlist = [ "http://....1", "http://....2", "http://....3", "http://....4" ];

Как узнать, когда менять:

Это сложно. Вы можете сделать это ленивым способом, который устанавливает таймер равным длине видео (не рекомендуется, особенно учитывая время загрузки). Другой способ - использовать обратные вызовы JavaScript от видеоплееров. Это сложнее, но гораздо лучше.

Более подробная информация об обратных вызовах здесь:

Обратные вызовы API JS YouTube

Vimeo в

...