Question

希望你能帮助我。我有一个Magnific iframe弹出窗口播放Vimeo视频。但是，一旦完成，我想自动关闭弹出窗口。这甚至可以通过这个插件吗？

我当前的（工作代码）：

$vimeo.magnificPopup({

    closeBtnInside: false,
    showCloseBtn: false,
    disableOn: 0,
    type: 'iframe',
    mainClass: 'mfp-fade',
    removalDelay: 0,
    preloader: true,
    fixedContentPos: false,
    callbacks: {

        beforeOpen: function() {
            cache.$main.addClass('playing');
        },

        open: function() {
                $(this.currItem.el).closest('.project__item').toggleClass('playing');
        },

        close: function() {
            $('.project__item').removeClass('playing');
        },

        afterClose: function() {
            cache.$main.removeClass('playing');
        }

    }

});

我搜索了网络和官方的Magnific API文档但没有成功。

任何正确方向的帮助或点头都会受到赞赏。

非常感谢， MIKEY。

Answer 1

添加iframe标记：

$vimeo.magnificPopup({

    closeBtnInside: false,
    showCloseBtn: false,
    disableOn: 0,
    type: 'iframe',
    mainClass: 'mfp-fade',
    removalDelay: 0,
    preloader: true,
    fixedContentPos: false,


   iframe: {
  markup: '<div class="mfp-iframe-scaler">'+
            '<div class="mfp-close"></div>'+
            '<iframe id="player1" class="mfp-iframe" frameborder="0" allowfullscreen></iframe>'+
          '</div>', // HTML markup of popup, `mfp-close` will be replaced by the close button

  patterns: {
    youtube: {
      index: 'youtube.com/', // String that detects type of video (in this case YouTube). Simply via url.indexOf(index).

      id: 'v=', // String that splits URL in a two parts, second part should be %id%
      // Or null - full URL will be returned
      // Or a function that should return %id%, for example:
      // id: function(url) { return 'parsed id'; } 

      src: '//www.youtube.com/embed/%id%?autoplay=1' // URL that will be set as a source for iframe. 
    },
    callbacks: {

        beforeOpen: function() {
            cache.$main.addClass('playing');
        },

        open: function() {
                $(this.currItem.el).closest('.project__item').toggleClass('playing');
        },

        close: function() {
            $('.project__item').removeClass('playing');
        },

        afterClose: function() {
            cache.$main.removeClass('playing');
        }

    }

});

向玩家添加活动：

var iframe = $('#player1')[0];
var player = $f(iframe);

player.addEvent('finish', onFinish);

＆＃34; onFinish＆＃34;是关闭你的magnificPopup的函数：

  var onFinish = function(){
       $vimeo.magnificPopup.close();
    }

当Vimeo视频播放完毕后，有没有办法关闭Magnific？

1 个答案: