javascript - Fullpage JS，在不同页面上执行

我正在 AngularJS 中开发一个项目，我正在使用 Fullpage.js 来滚动页面。到目前为止一切顺利，问题如下:

由于我有内页，这些页面也必须使用滚动脚本。
但是，即使将函数创建为 Scope 以在所有页面上工作，或者使用不同的名称创建它并从每个 FullPage 开始，也会返回以下错误:

FullPage:Fullpage.js 只能初始化一次，而且你要多次初始化!

有谁知道怎么做，当我启动另一个页面的功能时，取消上一页的FullPage功能，重新启动当前 Controller 的另一个功能？

遵循我正在使用的功能:

vm.rolagem_home = function(){
        $timeout(function(){
         $('#site').fullpage({
                    //Navigation
                    menu: '#menu',
                    lockAnchors: false,
                    //anchors:['firstPage', 'secondPage', 'trespage'],
                    navigation: false,
                    navigationPosition: 'right',
                    //navigationTooltips: ['firstSlide', 'secondSlide'],
                    showActiveTooltip: false,
                    slidesNavigation: true,
                    slidesNavPosition: 'bottom',

                    //Scrolling
                    css3: true,
                    scrollingSpeed: 700,
                    autoScrolling: true,
                    fitToSection: true,
                    fitToSectionDelay: 1000,
                    scrollBar: false,
                    easing: 'easeInOutCubic',
                    easingcss3: 'ease',
                    loopBottom: false,
                    loopTop: false,
                    loopHorizontal: true,
                    continuousVertical: false,
                    //normalScrollElements: '#element1, .element2',
                    scrollOverflow: false,
                    scrollOverflowOptions: null,
                    touchSensitivity: 15,
                    normalScrollElementTouchThreshold: 5,

                    //Accessibility
                    keyboardScrolling: true,
                    animateAnchor: true,
                    recordHistory: true,

                    //Design
                    controlArrows: true,
                    verticalCentered: true,
                  //  sectionsColor : ['#ccc', '#fff'],
                  paddingTop: '0em',
                  paddingBottom: '0px',
                  fixedElements: '#header, .footer',
                  responsiveWidth: 0,
                  responsiveHeight: 0,

                    //Custom selectors
                    sectionSelector: '.section',
                    slideSelector: '.slide',

                    //events
                    onLeave: function(index, nextIndex, direction){},
                    afterLoad: function(anchorLink, index){},
                    afterRender: function(){
                        $(window).load(function() {
                            $('#loading').hide();
                        });
                    },
                    afterResize: function(){},
                    afterSlideLoad: function(anchorLink, index, slideAnchor, slideIndex){
                        console.log(slideIndex);
                        if(slideIndex > 0){
                            $('.fp-prev').show();
                        }else{
                            $('.fp-prev').hide();
                        }
                        if(slideIndex == 6){
                            $('.fp-next').hide();
                        }else{
                            $('.fp-next').show();
                        }
                    },
                    onSlideLeave: function(anchorLink, index, slideIndex, direction, nextSlideIndex){

                    }
                });
     }, 1000);
    }

最佳答案

是的，您应该调用同一个 DIV 并销毁 FullPage，因此您设法再次调用了另一个 div。

if($('#agencia').fullpage() != ''){
      $('#agencia').fullpage.destroy('all');
}

工作 - https://codepen.io/alvarotrigo/pen/bdxBzv

关于javascript - Fullpage JS，在不同页面上执行，我们在Stack Overflow上找到一个类似的问题：https://stackoverflow.com/questions/38481152/