Question

我有一个使用Jetpack Infinite滚动条一次加载一个帖子的Wordpress网站。我正在尝试让Magnific Popup在无限滚动中的ajax在第一次调用后加载帖子后开始工作。

我认为做到这一点的最佳方法是重新初始化Magnific Popup，这样它就可以在ajax成功之后工作，也许可以通过某种方式进行回调？

即使网上有很多问题相同的问题，例如这个问题（infinite Scroll with Magnific Popup callback），我仍然没有运气，尽管我不确定如何将该解决方案与Infinite Scroll集成喷气背包。

这是我给Magnific Popup打电话。一旦ajax加载下一篇文章，是否有办法再次运行此操作？

    $('.projectDocumentation').each(function() {
    $(this).magnificPopup({
        delegate: '.popPop',
        type: 'image',
        image: {
          titleSrc: 'caption',
          cursor: 'null', 
          verticalFit: true, 
        },
        gallery: {
          enabled:true,
          preload: [0,2], 
          navigateByImgClick: true,
          arrowMarkup: '<button type="button" class="mfp-arrow mfp-arrow-%dir%"></button>',
          tCounter: '<span class="mfp-counter-index">%curr%/%total%</span>'
        },
        disableOn: function() {
          if( $(window).width() < 600 ) {
            return false;
          }
          return true;
        }

    });
})

下面的修订代码

$('#contentContainer').on("click", ".popPop", function(e) {
        e.preventDefault();
$(this).magnificPopup({
type: 'image',
image: {
  titleSrc: 'caption',
  cursor: 'null', 
  verticalFit: true,
},
gallery: {
  enabled:true,
  preload: [0,2], 
  navigateByImgClick: true,
  arrowMarkup: '<button type="button" class="mfp-arrow mfp-arrow-%dir%"></button>',
  tCounter: '<span class="mfp-counter-index">%curr%/%total%</span>'
},
}).magnificPopup('open');
})

重新初始化Magnific Popup jetpack无限滚动

0 个答案: