暂停或停止整页而不破坏

Question

我有一个正常滚动的页面。页面上有一个锚点，它会弹出一个模式，我正在其中初始化 fullpage.js。到目前为止这工作正常，但是当用户单击关闭图标时，我希望模式 window 关闭并让 fullpage.js 暂停或停止，这样整页滚动效果将被禁用，除非用户单击再次抛锚。我已经尝试使用 destroy 方法来执行此操作，但 fullpage 表示它只能初始化一次，因此当用户第二次单击锚点时 fullpage 不会重新初始化并引发此错误：fullPage: Fullpage.js只能初始化一次，而你正在做多次！

$('.js-show-modal').on('click', function() {
  var modal = $(this).attr('data-modal');
  $('.modal[data-modal="' + modal + '"]').show();
  $('#fullpage').fullpage({
    fixedElements: '.site-header',
    css3: true,
    navigation: true,
    navigationPosition: 'right'
  });
});

$('.js-close-modal').on('click', function(e) {
  e.preventDefault();
  $.fn.fullpage.destroy();
  $(this).closest('.modal').hide();
});

Answer 1

您尝试过使用 $.fn.fullpage.destroy('all'); 吗？这就是你为了彻底摧毁 fullPage.js 所需要使用的东西。否则只有 fullPage.js 创建的事件会被销毁。

有关 the docs 的信息：

//destroying all Javascript events created by fullPage.js (scrolls, hashchange in the URL...)
$.fn.fullpage.destroy();

//destroying all Javascript events and any modification done by fullPage.js over your original HTML markup.
$.fn.fullpage.destroy('all');

暂停或停止整页而不破坏

Pause or stop fullpage without destroying

jquery

fullpage.js