Question

我有一个视频页面，我将照片用作缩略图。我想将照片转换为.webm格式的视频播放。我编写了一个脚本，当您将鼠标悬停在照片元素上时，会添加并播放视频标签。

$(function(){
    $('.item-image').hover(function(){ 
        $('.item-image video').remove();
        $v = $(this).attr('v');
        if ($v){
            $p = '<video src="'+$v+'" class="p" ></video>';
            $(this).append($p);
        }
        $(this).children('video').play();
    }, function(){ 
        $(this).children('video').remove();
    }); 
});

不幸的是，当悬停时，自动播放不起作用。您必须先单击视频才能播放。我注意到单击并刷新页面后，将光标悬停后播放视频即可正常工作。您是否知道为什么它无法正常工作？

Answer 1

我找到了解决方案。只需在视频标签中添加静音

<video src="URL" loop muted autoplay class="p" ></video>

悬停光标后自动播放视频不起作用

1 个答案: