Добрый вечер!
Как сделать запуск видео при наведении на пункт меню и не дать ему остановиться при наведении на текст поверх этого видео? У меня в меню сделан ховер при наведении, но стоит навести мышь на текст поверх видео в пункте, видео останавливается, а надо, чтобы продолжало проигрываться и останавливалось только после покидания указателем пункта меню.
Весь скрипт к нему
$(".menu-item, .menu-item span").on("mouseover", "video", "span", function(){
$(this)[0].play();
});
$(".menu-item").on("mouseleave", "video", function(){
this.pause();
this.currentTime = 0;
});
Код одного пункта:
<div href="portfolio.html" class="menu-item nav-link">
<span class="r">Портфолио</span>
<video muted>
<source src="video/portfolio.mp4" type="video/mp4">
Ваш браузер не поддерживает тег video. Пожалуйста, обновите свой браузер до более свежей версии.
</video>
</div>
Я понимаю, что видео вырубается из-за "mouseleave", но иначе, чем с "mouseover" запуск видео при наведении мне сделать не удалось((( И не нашла решения другого рабочего, увы. С методом hover работать не хочет. Точнее с ховером можно запустить, но нельзя остановить. Можно сделать меньший z-index у текста, но тогда не будет работать ховер на самом тексте.
Может кто-нибудь делал подобное?