Question

我有youtube视频动态注入wordpress到多个模态。

<div class="modal-overlay features-modal" id="modal-<?php echo $do; ?>">
    <div class="modal-bg">
        <div class="modal-close"></div>
        <div class="modal">
            <div class="videoWrapper">
                <iframe class="youtube-video" src="<?php the_sub_field('youtube_video') ?>?rel=0&amp;controls=0&amp;showinfo=0" frameborder="0" allowfullscreen allowscriptaccess="always"></iframe>
            </div>
        </div>
    </div>
</div>

我想要完成的是让每个YouTube视频在模态打开时播放，并在模态关闭时暂停。现在我可以让视频暂停，但是当我尝试使用autoplay = 1实现打开时播放，它会在关闭时再次播放（此代码不会反映点击播放）。

    function modalFadeOut() {
        $('.open-modal').fadeOut("fast").removeClass("open-modal");
        $('html').css('overflow','');
    };

    // features scroll video modal 
    $(".video-button").click(function() {
        var Modal = $(this).data("modal-type");
        $("#"+Modal).fadeIn("fast").addClass("open-modal");

    });

    $('.modal-bg').click(function() {
        modalFadeOut();
        var vid = $(this).find('iframe[src*="youtube"]');
        if ( vid.length > 0 ) {
           var src = vid.attr('src');
           vid.attr('src', '');
           vid.attr('src', src);
        }
    });

Wordpress注入youtube视频，播放模态打开，暂停模态关闭

0 个答案: