Как задать плееру автоматическое воспроизведение при нажатии на сылку?

Question

[noggano100]

Не хочет работать автопроигрывание видео, что только не делал в гугле читал не один ответ не помог,
должно срабатывать включение видео при открытии модельного окна,
так же в не хочет работать,

видео работает через API
что только не делал не помогло

<!-- Модальный блок -->
        <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>

Answer 1

[Михаил Р.]

https://developers.google.com/youtube/iframe_api_r...
https://developers.google.com/youtube/player_param...

let player;

function onYouTubePlayerAPIReady() {
    player = new YT.Player('player', {
        videoId: '123',
        playerVars: {
            autoplay: 1,
            fs: 0
        },
        events: {
            'onReady': onPlayerReady
        }
    });
}

Так же учитывайте тот факт, что многие браузеры блокируют авто-воспроизведение звуков и видео без явного действия пользователя.

Answer 2

[Nik Faraday]

Попробуйте вот такую комбинацию с помощью JS:

<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();
    }