需要停止在弹出窗口中自动播放视频

时间:2018-07-05 05:54:17

标签: popup html5-video autoplay

我在弹出模块中有一个视频,可以在这里查看,选择查看视频链接http://www.mcveaghfleming.co.nz/sandbox.html 问题是,一旦选择链接,视频将立即播放。我想阻止这种情况的发生,因此只能使用“播放”按钮控件播放。 我尝试过自动播放:false;等等,但这是行不通的。下面是脚本和html等。

非常感谢您提供任何帮助,以使它更好地工作。 谢谢

  <!-- video activate link -->
  <a href="javascript:void(0)" id="video1"><span class="learnmore">VIEW VIDEO  </span></a>

    <!-- the popup video-->
    <div id="vidBox">
        <div id="videCont">
            <video id="v1" controls>
                <source src="video/mcveaghfleming-100-years.mp4" type="video/mp4">

            </video>
        </div>
    </div>
    <!-- end-->



(function ($) {

$.fn.VideoPopUp = function (options) {

    var defaults = {
        backgroundColor: "#000000",
        opener: "video",
        maxweight: "640",
        pausevideo: false,            
        idvideo: ""
    };

    var patter = this.attr('id');

    var settings = $.extend({}, defaults, options);

    var video = document.getElementById(settings.idvideo);
    function stopVideo() {
        video.pause();
        video.currentTime = 0;
    }

    $('#' + patter + '').css("display", "none");
    $('#' + patter + '').append('<div id="opct"></div>');
    $('#opct').css("background", settings.backgroundColor);
    $('#' + patter + '').css("z-index", "100001");
    $('#' + patter + '').css("position", "fixed")
    $('#' + patter + '').css("top", "0");
    $('#' + patter + '').css("bottom", "0");
    $('#' + patter + '').css("right", "0");
    $('#' + patter + '').css("left", "0");
    $('#' + patter + '').css("padding", "auto");
    $('#' + patter + '').css("text-align", "center");
    $('#' + patter + '').css("background", "none");
    $('#' + patter + '').css("vertical-align", "vertical-align");
    $("#videCont").css("z-index", "100002");
    $('#' + patter + '').append('<div id="closer_videopopup">&otimes;    </div>');
    $("#" + settings.opener + "").on('click', function () {
        $('#' + patter + "").show();
        $('#'+settings.idvideo+'').trigger('play');

    });



    $("#closer_videopopup").on('click', function () {
        if(settings.pausevideo==true){
                $('#'+settings.idvideo+'').trigger('pause');
            }else{
                stopVideo();
            }
        $('#' + patter + "").hide();
    });
    return this.css({

    });
};

}(jQuery));

1 个答案:

答案 0 :(得分:0)

您正在告诉它在您的代码中播放。删除以下行:

 $('#'+settings.idvideo+'').trigger('play');