учебные пособия

Как вставить видео на YouTube с автозапуском и без звука

  Дата публикации: May/2024
{title}

В этом уроке я покажу вам, как вставить видео YouTube на ваш сайт, которое запускается автоматически при загрузке страницы и не имеет звука . Для этого мы будем использовать API, который предоставляет нам Youtbe. Нам нужно будет написать код на JavaScript, совсем немного, давайте начнем.

Шаг 1
Первое, что нам нужно сделать, это идентификатор видео, которое мы хотим загрузить. Для этого мы заходим на YouTube и ищем нужное видео, идентификатор которого будет взят из v = в URL, на следующем изображении я покажу вам пример:

{title}

Теперь мы можем добавить скрипт на нашу страницу, ниже я объясню некоторые детали, которые необходимо учитывать.

Шаг 2
Нам нужен пробел в нашем HTML, чтобы добавить проигрыватель, для этого мы используем div, эта инструкция в коде такова (id необходим для функции, которую мы используем API): 

Шаг 3 
Мы связываем API YouTube с нашей страницей, для этого пишем следующую инструкцию: 
 Обратите внимание, что это асинхронная нагрузка.
Шаг 4 
Мы добавляем несколько тегов скрипта (в конце самого тела), в них мы создадим функцию на YouTubeIframeAPIReady () . Название функции вы должны оставить так. В рамках этой функции мы настроим ширину, высоту проигрывателя, идентификатор видео и некоторые другие функции. 
 function onYouTubeIframeAPIReady () {var player; player = new YT.Player ('playerSinAudio', {videoId: '4CGxmrq3YB0', ширина: 730, высота: 370, playerVars: {autoplay: 1, элементы управления: 1, showinfo: 0, модбрендинг: 0, цикл: 1, фс : 0, cc_load_policty: 0, iv_load_policy: 3, автокрытие: 0}, события: {onReady: function (e) {e.target.mute ();}}}); } 
 [color = # a9a9a9] Код с YouTube API [/ color]
Некоторые оценки
  • Идентификатор видео должен быть введен в videoId .
  • Autolay используется для автозапуска, 1 будет означать, что он запускается один, если вы установите 0 нет.
  • Чтобы заставить его замолчать, в зоне событий используется следующая функция:
 onReady: function (e) {e.target.mute (); } 
 Вы также можете установить количество повторов видео (цикл), если отображаются элементы управления (элементы управления), такие как воспроизведение, громкость и т. Д. 
Вот полный код: 
function onYouTubeIframeAPIReady () {var player; player = new YT.Player ('playerSinAudio', {videoId: '4CGxmrq3YB0', ширина: 730, высота: 370, playerVars: {autoplay: 1, элементы управления: 1, showinfo: 0, модбрендинг: 0, цикл: 1, фс : 0, cc_load_policty: 0, iv_load_policy: 3, автокрытие: 0}, события: {onReady: function (e) {e.target.mute ();}}}); } 
 При открытии файла с кодом выше проигрыватель выйдет, как показано на следующем рисунке:
{title}
Если вы хотите код, я оставляю здесь почтовый индекс:
 videoYoutube.zip 533 байта 158 скачиваний
  • 0








СТАТЬЯ ПО ТЕМЕ Как экспортировать пароли Firefox Quantum 58 или выше