Мне нужно настроить эффект в JS ⇐ Html

[Anonymous]

Я создаю баннер и миниатюру, и на данный момент мне удалось создать JavaScript, который может запускать видео при наведении на него курсора мыши, как на миниатюрах YouTube. Однако я видел, что на YouTube происходит плавный переход от миниатюры к видео, и у меня этого не получается.
Каждый раз, когда я пытаюсь это сделать, карточка исчезает. при перезагрузке страницы и при наведении курсора мыши на карту видео начинается через 1,1 секунды и зависает. Он также не возвращается к миниатюре после отвода мыши, как на YouTube. Кто-нибудь может мне помочь, пожалуйста? Есть предложения?



16:24



Aula 06





document.querySelectorAll('.videoPreview').forEach(function(vid) {
vid.onmouseover = function() {
this.play();
}
vid.onmouseout = function() {
this.load(); // stop and show poster
}
})


Подробнее здесь: https://stackoverflow.com/questions/793 ... fect-in-js