暂停或停止整页而不破坏

问题描述

我的页面正常滚动.页面上有一个锚点，该锚点会弹出一个模式，我将在其中初始化fullpage.js.到目前为止，这种方法还不错，但是当用户单击关闭图标时，我希望关闭模式窗口，并让fullpage.js暂停或停止，以便除非用户再次单击锚点，否则禁用全页滚动效果.我尝试使用destroy方法执行此操作，但是fullpage只能将其初始化一次，因此，当用户第二次单击锚点时，fullpage不会重新初始化，并且会引发此错误:fullPage:Fullpage.js仅可以初始化一次，您就可以执行多次！

I have a page with normal scrolling. There is an anchor on the page that pops open a modal in which I am initializing fullpage.js. This works fine so far, but when the user clicks a close icon, I want the modal window to close and for fullpage.js to pause or stop, so that the fullpage scrolling effect is disabled unless the user clicks the anchor again. I've tried using the destroy method to do this, but fullpage says that it can only be initialized once, so when the user clicks the anchor a second time fullpage does not reinitialize and this error is thrown: fullPage: Fullpage.js can only be initialized once and you are doing it multiple times!

$('.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();
});

推荐答案

您是否尝试过使用$.fn.fullpage.destroy('all');?那就是您需要使用它来完全销毁fullPage.js.否则，只会破坏由fullPage.js创建的事件.

Have you tried using $.fn.fullpage.destroy('all'); ? That's what you need to use in order to completely destroy fullPage.js. Otherwise only the events created by fullPage.js gets destroyed.

有关文档的信息:

//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');

这篇关于暂停或停止整页而不破坏的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持！