Следующий php выводит на мою страницу различные видео с именем класса ".videos":
<?php
wp_video_shortcode($attr, $content);
?>
Сгенерированный код для каждого видео выглядит так:
<video class="videos" poster="/poster.png" preload="none" controls="controls">
<source type="video/mp4" src="/VideoPreview_04.mp4?_=1">
</video>
Следующий jquery - удалить элементы управления видео и заставить каждый из них играть при наведении курсора мыши и приостанавливать при наведении мыши:
<script type="text/javascript">
jQuery(document).ready(function() {
jQuery(".videos").removeAttr("controls");
jQuery(".videos").on("mouseover", function(event) {
this.play();
}).on('mouseout', function(event) {
this.pause();
});
});
</script>
ПРОБЛЕМА:
Все это работает как надо, ЗА ИСКЛЮЧЕНИЕМ, когдапри первой загрузке страницы события наведения мыши не распознаются до тех пор, пока вы не нажмете сначала где-нибудь на странице.
Я уверен, что это связано с делегированием или чем-то в этом роде.Следующий пример, например, работает при загрузке страницы, не щелкая сначала где-нибудь на странице:
jQuery(document).on('focus mouseover', '.videos', function(e){
alert("focused on " + jQuery(e.target).attr('id'));
});
Однако при привязке видео к вышеуказанному коду видео не реагируют, пока вы снова не нажметестраница где-то первая.
Я также пробовал document.focus ();и другие способы сфокусироваться на различных элементах, но не могут заставить его работать.
Помогите, у меня кончились волосы, чтобы вытащить: (