В този урок ще ви науча как да вмъкнете видеоклип от youtube на вашата уеб страница, който се стартира автоматично при зареждане на страница и няма звук. За това ще използваме API, предоставен от Youtbe. Ще трябва да напишем код в JavaScript, всъщност много малко, нека започнем.
Етап 1
Първото нещо, което трябва да продължим, е идентификаторът на видеоклипа, който искаме да качим. За това влизаме в YouTube и търсим желания видеоклип, идентификаторът на това ще дойде от v = в рамките на URL адреса, на следното изображение ви показвам пример:
Сега можем да добавим скрипта към нашата страница, по -долу обяснявам някои подробности, които трябва да се вземат предвид.
Стъпка 2
Нуждаем се от място в нашия HTML, където да добавим плейъра, за това използваме div, тази инструкция в кода е тази (идентификаторът е необходим за функцията, която използваме от API):
Стъпка 3
Свързваме API на YouTube с нашата страница, за това пишем следната инструкция:
Имайте предвид, че това е асинхронен товар.
Стъпка 4
Добавяме някои скриптови тагове (в края на самото тяло), в тях ще създадем функцията onYouTubeIframeAPIReady (). Името на функцията трябва да я оставите така. В рамките на тази функция ще конфигурираме ширината, височината на плейъра, идентификационния номер на видеото и някои други характеристики.
[color = # a9a9a9] Код с API на Youtube [/ color]
Някои прозрения
- Идентификаторът на видеото трябва да бъде въведен videoId.
- За автоматично стартиране се използва автоматично изпълнение, 1 ще бъде, че започва сам, ако поставите 0 няма да стане.
- За да го заглушите, се използва следната функция в областта на събитията:
onReady: function (e) {e.target.mute (); }Можете също така да конфигурирате броя на повторенията на видеоклипа (цикъл), ако се показват контролите, като възпроизвеждане, сила на звука и т.н.
Ето пълния код:
При отваряне на файла, който има горния код, плейърът ще се появи, както се вижда на следното изображение:Увеличете
В случай, че искате кода, оставям ви тук цип:
videoYoutube.zip 533 байта 245 изтегляния