0

введите сюда описание изображения

Здравствуйте. Подскажите, можно ли вставить видео с "youtube", а вместо стандартного ютуб плеера заменить кнопку "play" на такую как на скрине. Или в двух словах расскажите новичку, как это реализовано. Спасибо.

1 ответ 1

0

Добрый день. Данную задачу можно решить по средствам Youtube API. К примеру у нас есть плеер, и есть блок с нужной информацией, позиционированный строго над плеером, по клику на блок - нужно скрыть его и выполнить команду play у плеера.

var yt_frame = document.querySelector('.video__player'),
	video_placeholder = document.querySelector('.video__placeholder');
  
  video_placeholder.addEventListener('click',play);

function play(){
	yt_frame.contentWindow.postMessage(JSON.stringify({
                'event': 'command',
                'func': 'playVideo',
                'args': []
            }),'*');
          video_placeholder.style.display="none";  
}
.video {
  position:relative;
width:400px;
height:400px;
}

.video__player {
  width:100%;
  height:100%;
}

.video__placeholder {
  position:absolute;
  width:100%;
  height:100%;
  background:red;
}
<div class="video">
<div class="video__placeholder">
  Контент
</div>
<iframe class="video__player" src="https://www.youtube.com/embed/vYrIoMREDQs?enablejsapi=1" frameborder="0" allowfullscreen></iframe>
</div>

Fiddle - https://jsfiddle.net/erm0j1tq/

0

Ваш ответ

By clicking “Отправить ответ”, you agree to our terms of service and acknowledge you have read our privacy policy.

Всё ещё ищете ответ? Посмотрите другие вопросы с метками или задайте свой вопрос.