<!-- Модальный блок -->
<div class="overlay" id="video1"></div>
<div class="modal">
<div class="video__title">
Это просто заголовок и краткое описание видео
</div>
<div class="video" id="youtube">
<iframe width="1280" height="720" id="player" src="http://www.youtube.com/embed/J32MrXDK6oI?version=3&enablejsapi=1" frameborder="0" allow="autoplay"></iframe>
</div>
<a href="#close" id="stop" class="close"></a>
</div>
<!-- конец блока видео-->
<script type="text/javascript" src="http://www.youtube.com/player_api"></script>
<script>
var player;
function onYouTubePlayerAPIReady() {
player = new YT.Player('player');
fs: 0;
autoplay:1; /////не хочет работать
}
</script>
let player;
function onYouTubePlayerAPIReady() {
player = new YT.Player('player', {
videoId: '123',
playerVars: {
autoplay: 1,
fs: 0
},
events: {
'onReady': onPlayerReady
}
});
}
<video id="myVideo" autoplay>
<source src="your_video.mp4" type="video/mp4">
</video>
document.getElementById('myVideo').play();
<a href="#" onclick="openModal()">Открыть видео</a>
<!-- Модальное окно -->
<div class="overlay" id="video1">
<div class="modal">
<div class="video__title">
</div>
<div class="video" id="youtube">
<iframe width="640" height="360" id="player" src="https://www.youtube.com/embed/J32MrXDK6oI?version=3&enablejsapi=1" frameborder="0" allow="autoplay; encrypted-media" allowfullscreen></iframe>
</div>
<a href="#" onclick="closeModal()" class="close">Закрыть</a>
</div>
</div>
<script type="text/javascript" src="http://www.youtube.com/player_api"></script>
var player;
function onYouTubePlayerAPIReady() {
player = new YT.Player('player', {
events: {
'onReady': onPlayerReady
}
});
}
function onPlayerReady(event) {
event.target.playVideo();
}
function openModal() {
document.getElementById('video1').style.display = 'block';
}
function closeModal() {
document.getElementById('video1').style.display = 'none';
player.stopVideo();
}