我有以下问题。这是代码:
<div class="article-content-wrapper>
<%= video_tag 'Garden.mp4', :class => "video", :controls => true %>
</div>
在鼠标悬停时,我想让视频进入自动播放/恢复,在鼠标输出时,视频要暂停。
我如何使用JQuery做到这一点?我在JQuery网站上搜索了很多,但我找不到任何东西给我。我试过的代码不起作用。
cSlider: stop autoplay on mouseover 要么 autoplay video in slider或JQuery autoplay video on click show
感谢您的帮助。
答案 0 :(得分:7)
简单的解决方法:
$(function(){
$('.video').on('mouseenter', function(){
if( this.paused) this.play();
}).on('mouseleave', function(){
if( !this.paused) this.pause();
});
});
答案 1 :(得分:4)
$(document).ready(function() {
$(document).on({
mouseenter: function () { this.play(); },
mouseleave: function () { this.pause(); }
}, '.video');
});