悬停时自动播放html视频？

我在互联网上搜索，发现了一些很好的例子，但由于某种原因，当我试图用我的代码实现它们，它不工作。我不知道我好像做错了什么。悬停时自动播放html视频？

（对于荷兰的班级名称我很抱歉，希望它不是太混乱）。对不起，如果我对此非常愚蠢。

HTML：

<div class="drievijfde-wrapper portfolio-wrapper"> 
    <div class="single-item singlevidjs drievijfde-padding" style="background-image:url(img/work-placeholder.png); background-position: center center; background-size: cover;"> 
     <video loop preload="auto" id="portfolio-vid"> 
      <source src="video/test reel_1.mp4" type="video/mp4"> 
     </video> 
     <a href="#"> 
      <div class="metadata"> 
       Interior Lamps 
      </div> 
     </a> 
    </div> 
</div>

JS：

var figure = $(".singlevidjs").hover(hoverVideo, hideVideo); 

function hoverVideo(e) { 
    $('video', this).get(0).play(); 
} 

function hideVideo(e) { 
    $('video', this).get(0).pause(); 
}

来源

2017-04-03 tehchriis

首先是jQuery代码，描述问题时，请更详细一点：我的代码不工作，将帮助任何人;）无论如何，这里是一个工作jsbin： http://jsbin.com/cupusesoce/edit?html,js输出所以问题一定是：jQuery没有加载或与您的视频的问题:) – MarcelD

它工作[这里]（https：// jsfiddle .net/8r396y6u /）检查你的'jquery'加入？ –

是的！我把Jquery搞乱了，现在我觉得很糟糕。谢谢你指出。还有是@DincaAdrian当我做到这一点时，我c然心动，但它只是用于测试。谢谢 – tehchriis

您可以使用下面这个

$('#portfolio-vid').mouseover(function(){ 
    $(this).get(0).play(); 
}).mouseout(function(){ 
    $(this).get(0).pause(); 
})

来源

2017-04-03 10:59:14

悬停时自动播放html视频？

回答

相关问题