Доброго дня!
Использую в проекте Slick.js
https://kenwheeler.github.io/slick/
Все работает кроме одного. Видео не запускается. Во всех браузерах работает, кроме проклятого Edge.
Обращаюсь к знатокам JavaScript. Что такого может быть в slick.js что не дает стартовать видео.
Пробовал без slick, видео работает, пробовал с табуляцией Bootstrap - видео работает. "Баг" где-то в js самого slick`а. В консоле Edge ошибок нет.
Может кто знает что нужно "подкрутить" в коде чтобы видео включалось в браузере Edge.
Так не хочется переписывать всю структуру из-за такого косяка
код примера:
<!DOCTYPE html>
<html lang="ru">
<head>
<meta charset="UTF-8">
<title>test</title>
<link rel="stylesheet" type="text/css" href="//cdn.jsdelivr.net/npm/slick-carousel@1.8.1/slick/slick.css"/>
</head>
<body>
<div class="slick-slider">
<div>
<video class="viedeo__file" preload="auto" autoplay="true" loop="loop" muted="muted" volume="0" id="video">
<source src="videoplayback.mp4" type="video/mp4" id="source-video">
</video>
</div>
<div>
<video class="viedeo__file" preload="auto" autoplay="true" loop="loop" muted="muted" volume="0" id="video">
<source src="videoplayback.mp4" type="video/mp4" id="source-video">
</video>
</div>
<div>
<video class="viedeo__file" preload="auto" autoplay="true" loop="loop" muted="muted" volume="0" id="video">
<source src="videoplayback.mp4" type="video/mp4" id="source-video">
</video>
</div>
</div>
<script src='https://cdnjs.cloudflare.com/ajax/libs/jquery/3.3.1/jquery.min.js'></script>
<script src='https://cdnjs.cloudflare.com/ajax/libs/slick-carousel/1.9.0/slick.min.js'></script>
<script>
$(document).ready(function(){
$('.slick-slider').slick({
// setting-name: setting-value
});
});
</script>
<style>
div{
height:360px;
}
</style>
</body>
</html>
ссылка на архив примера
https://cloud.mail.ru/public/4xK7/2S8CTtAU6