Question

我正在创建一个网站，其中将显示几个视频，我绝对需要在鼠标悬停时自动播放这些视频。

视频托管在Vimeo上，我使用默认的Elementor视频播放器。我尝试了很多发现的代码和几个插件，但都无法正常工作，我也不知道该怎么办。

这是我创建的演示网站，向您展示我的问题：http://loool.xyz/ghz/

我也不明白为什么默认的iframe播放器在设置相同的情况下看起来会有所不同，因此我在演示中添加了另一个播放器，它看起来更好，而且更容易自定义。（我还为此播放器激活了调试模式）

您对我该如何做才能有任何想法？

$(".elementor-video-iframe").each(function() {
    var player = new Vimeo.Player(this);
    $(this).on('mouseenter', function() {
        player.play();
    });
    $(this).on('mouseleave', function() {
        player.pause();
    });
});

<!-- doesn't seems to work in this snippet you can find full site here http://loool.xyz/ghz/ -->

<script src="https://player.vimeo.com/api/player.js"></script>

<!-- for AZ custom video player -->

<link rel="stylesheet" href="http://loool.xyz/ghz/wp-content/plugins/az-video-and-audio-player-addon-for-elementor/assets/css/plyr.css?ver=5.5.1" media="all">
<link rel="stylesheet" href="http://loool.xyz/ghz/wp-content/plugins/az-video-and-audio-player-addon-for-elementor/assets/css/main.css?ver=5.5.1" media="all">
<script src="http://loool.xyz/ghz/wp-content/plugins/az-video-and-audio-player-addon-for-elementor/assets/js/main.js?ver=1.0.0"></script>
<script src="http://loool.xyz/ghz/wp-content/plugins/az-video-and-audio-player-addon-for-elementor/assets/js/plyr.min.js?ver=1.0.0"></script>
<script src="http://loool.xyz/ghz/wp-content/plugins/az-video-and-audio-player-addon-for-elementor/assets/js/plyr.polyfilled.min.js?ver=1.0.0"></script>

<!-- Default elementor video player -->

<iframe class="elementor-video-iframe" allowfullscreen="" title="vimeo Video Player" src="https://player.vimeo.com/video/112760332?color&amp;autopause=0&amp;loop=0&amp;muted=0&amp;title=0&amp;portrait=0&amp;byline=0#t="></iframe>

<!-- AZ custom video player -->

<div class="elementor-element elementor-element-10b3beb elementor-widget elementor-widget-vapfem_video_player" data-id="10b3beb" data-element_type="widget" data-widget_type="vapfem_video_player.default">
                <div class="elementor-widget-container">
                        
            <div class="plyr plyr--full-ui plyr--video plyr--vimeo plyr--paused plyr--stopped plyr__poster-enabled" data-settings="{&quot;seek_time&quot;:10,&quot;volume&quot;:1,&quot;muted&quot;:&quot;false&quot;,&quot;clickToPlay&quot;:&quot;true&quot;,&quot;keyboard_focused&quot;:&quot;false&quot;,&quot;keyboard_global&quot;:&quot;false&quot;,&quot;tooltips_controls&quot;:&quot;false&quot;,&quot;hideControls&quot;:&quot;true&quot;,&quot;resetOnEnd&quot;:&quot;false&quot;,&quot;tooltips_seek&quot;:&quot;false&quot;,&quot;invertTime&quot;:&quot;true&quot;,&quot;fullscreen_enabled&quot;:&quot;false&quot;,&quot;speed_selected&quot;:false,&quot;quality_default&quot;:null,&quot;controls&quot;:[&quot;play-large&quot;],&quot;ratio&quot;:&quot;null&quot;,&quot;debug_mode&quot;:&quot;true&quot;}"><div class="plyr__controls"></div>
                <div class="plyr__video-wrapper plyr__video-embed" style="padding-bottom: 56.25%;"><div class="plyr__video-embed__container" poster="https://i.vimeocdn.com/video/502992315.jpg" style="transform: translateY(-38.2812%);"><iframe src="https://player.vimeo.com/video/112760332?loop=false&amp;autoplay=false&amp;muted=false&amp;gesture=media&amp;playsinline=true&amp;byline=false&amp;portrait=false&amp;title=false&amp;speed=true&amp;transparent=false" allowfullscreen="" allowtransparency="" allow="autoplay" title="Player for Alain GHAZAL / Chroniques Criminelles" data-ready="true" tabindex="-1"></iframe></div><div class="plyr__poster" style="background-image: url(&quot;https://i.vimeocdn.com/video/502992315.jpg&quot;);"></div></div><div class="plyr__captions"></div>
            <button type="button" class="plyr__control plyr__control--overlaid" data-plyr="play" aria-label="Play, Alain GHAZAL / Chroniques Criminelles"><svg role="presentation" focusable="false"><use xlink:href="#plyr-play"></use></svg><span class="plyr__sr-only">Play</span></button></div>
                            </div>
                </div>

视频播放并在鼠标悬停时停下来

0 个答案: