Как выполнить своё действие после проигрывания видео в Tilda
После просмотра
откроется ссылка
После просмотра
откроется ссылка

Как выполнить своё действие после проигрывания видео YouTube в Tilda

1
Создали ZeroBlock и добавили в него элемент HTML
2
В этот элемент добавили контейнер
<div id="youtubevideo"></div>
3
Добавили Image и Button, которые должны появиться в конце
И задали им класс hide_element
4
Добавили код в блок другое Т123
В коде прописали ID видео
videoId: 'o9AQXjTlKt8',

И своё действие в конце видео
$('.hide_element').removeClass('hide_element');
Библиотека для примера с YouTube
<script src="https://www.youtube.com/player_api"></script>
<style>
.hide_element{
display:none;
}    
</style>

<script>
let playerYouTube1;
    function onYouTubePlayerAPIReady() {
        playerYouTube1 = new YT.Player('youtubevideo', {
          height: '100%',
          width: '100%',
          videoId: 'o9AQXjTlKt8', //Видео с YouTube
          events: {
            'onStateChange': onPlayerStateChange
          }
        });
    }
    function onPlayerStateChange(event) {        
        if(event.data === 0) {            
            $('.hide_element').removeClass('hide_element');
        }
    }
</script>

Как выполнить своё действие после проигрывания видео mp4 в Tilda

1
Создали ZeroBlock и добавили в него элемент HTML
2
В этот элемент добавили видео

<video id="videotrigger" width="100%" controls controlsList="nodownload" playsinline >
<source src="https://310401.selcdn.ru/MIXED/Aquarellmalerei_%20Schmetterling.mp4" type="video/mp4">
</video>
3
Добавили Image и Button, которые должны появиться в конце
И задали им класс hide_element
4
Добавили код в блок другое Т123
Прописали своё действие в конце видео
$('.hide_element').removeClass('hide_element');
Библиотека для примера с mp4
<style>
.hide_element{
display:none;
}    
</style>
<script>
let videotrigger = document.getElementById('videotrigger');
videotrigger.addEventListener('ended', function () {
    $('.hide_element').removeClass('hide_element2');        
}, false);
</script>
Made on
Tilda