Вопрос? Видеопревью срабатывают после клика мыши

Всем привет.
Пытаюсь на локалке создать сайтик. Видеотуб. На главной располагаются видеопревью . При наведении на них мышкой - начинается воспроизведение видеофайла. И все вроде работает, но есть загвоздка, Пока не сделаешь клик мышкой в любой части сайта, воспроизведение видеопревью не начинается.

Код использую вот такой.
подгружаю скрипт
ajax.googleapis.com/ajax/libs/jquery/1/jquery.min.js

а в превью прописываю

<video poster="{poster.jpg}" loop>
<source src="[preview.mp4]" type="video/mp4" />
</video>

script
$("body").on("mouseover", "video", function(){
this.play();
$( this ).css( "background-color", "black" );
});
$("body").on("mouseleave", "video", function(){
this.pause();
})
/script




Вопрос - как избавиться от дополнительного клика мыши и сделать так, чтобы видеопревью запускалось сразу при наведении?

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

 

$( "body" ).focus();
Как самый тупой вариант )

 

Я правильно понял что вместо
$("body").on
нужно использовать
$( "body" ).focus ?

Если да - то это не сработало.

 

$( "body" ).focus(); имитирует ваше нажатие мышкой.
Можете попробовать вставить перед закрывающим тегом script

 

Неа, тоже не сработало

 

jQuery.hoverPlay (biohzrdmx.github.io)

Ознакомьтесь и у Вас все получится.

 

Политика автозапуска видео запрещает воспроизводить видео со звуком до взаимодействия пользователем со страницей (щелкнул, коснулся и т. д.). Никакие другие методы и js коды для имитации не сработают. У видео должен быть установлен атрибут muted.