Question

我正在使用fullPage.js（js插件提供一页滚动功能），现在我必须在1199宽度以下禁用此功能。我试图通过在基于条件（窗口宽度应大于1199）的情况下在寡妇加载和调整大小两者中调用它的函数来实现此目的，它在窗口加载时起作用，但调整大小功能不起作用，并且在控制台中显示错误< / p>

错误：： fullPage：Fullpage.js只能初始化一次，而您正在这样做它多次！

因为库在页面加载中加载两次，而在窗口调整大小时加载另一次。如何在窗口调整大小和窗口加载时禁用宽度1199以下的宽度。

这是我的代码：

    var init = {
    one_page_scroll : function(){ 
                /*--------- one pge scroll --------*/
                var windowWidth = $(window).width();
                if(windowWidth > 1199){
                    $('#fullpage').children().each(function(){
                        $(this).not( ".vc_row-full-width" ).addClass('section');
                    });
                    $('#fullpage').fullpage({
                        navigation: true,
                        interlockedSlides: false,
                        fixedElements : '',
                    });

                }

            },
};

我在窗口加载和窗口调整大小时都在内部调用了此函数，如下所述：

jQuery(document).ready(function(){
    $(window).on('load', function(){
        init.one_page_scroll();
    });
});
jQuery( window ).resize(function() {
    var windowWidth = $(window).width();
    if(windowWidth > 1199){ 
        init.one_page_scroll();
    }
});

Answer 1

为什么不使用响应式选项而不是不初始化它呢？

您可以使用responsiveWidth或responsiveHeight来关闭自动滚动。然后，您可以将其与fp-auto-height-responsive结合使用，以关闭全屏部分和幻灯片。

如果您甚至需要更多，可以使用responsiveSlides选项将水平幻灯片转换为响应时的垂直幻灯片。

禁用全页滚动，低于指定的分辨率

1 个答案: