Как добавить кнопку включения и выключения звука для видеообложки в Tilda
Call Out My Name
Taken from the album My Dear Melancholy
mp4 version
THE WEEKND

Как добавить кнопку включения и выключения звука для видеообложки в Tilda

1
Создали ZeroBlock
2
Добавили в него две иконки динамика динамика (отключили им LazyLoad)
- одной иконке задали ссылку #unmutesound
- второй иконке задали ссылку #mutesound
3
Добавили код на страницу в блок Другое - Т123
В коде прописали:
- ID нашего Zero блока #rec163887639
- прописали ссылку на наше mp4 видео
https://mobclip.net/uploads/files/2018-04/1524816022_the-weeknd-call-out-my-name-official-video.mp4
Mo-ti Level Up
Видео инструкции по добавлению кода и работе с Zero Block.
Добавляем управление звуком фонового видео.
Создаём собственные кнопки управления в Zero.
Длительность видео: 19 минут
Фрагмент видео
Библиотека для примера

<style>
.btnsound{
    -webkit-tap-highlight-color: rgba(0, 0, 0, 0);
}
</style>

<video id='zeromp4video' width="100%" height="100%" style="-o-object-fit: cover;object-fit: cover;" preload="auto" muted playsinline autoplay="autoplay" loop="loop" >
   <source src="https://310401.selcdn.ru/MIXED/1524816022_the-weeknd-call-out-my-name-official-video.mp4" type="video/mp4">
</video>
<script>
$( document ).ready(function() {
$('#zeromp4video').appendTo('#rec165974452 .t396__carrier');
//Присваиваем классы нашим кнопкам
$("[href = '#unmutesound'] ").addClass('unmutesound btnsound');
$("[href = '#mutesound'] ").addClass('mutesound btnsound').hide();
myZeroVid=document.getElementById("zeromp4video");
//При нажатии на кнопку UNMUTE
$(".unmutesound").click(function(event) {
 myZeroVid.volume=0.7;
 $("#zeromp4video").prop('muted', false);
$(".btnsound").toggle(400);event.preventDefault();
});
//При нажатии на кнопку MUTE
$(".mutesound").click(function(event) {
$("#zeromp4video").prop('muted', true);
$(".btnsound").toggle(400);event.preventDefault();
});
});
  </script>
Made on
Tilda