Fullpage JS, execute on different pages

匿名 (未验证) 提交于 2019-12-03 00:57:01

问题:

I'm developing a project in AngularJS and I am using the Fullpage.js to scroll the page. So far so good, the problem is as follows:

As I have inside pages, must also use the scroll script these pages. But even creating the function as Scope to work on all pages or creating it with different name and starting in each of the FullPage returns the following error:

FullPage: Fullpage.js can only be initialized once and you are doing it multiple times !

Does anyone know how can I do so that when I start the function of another page, I cancel the function of FullPage the previous page and start another function of the current controller again?

Follows function I'm using:

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);     } 

回答1:

Yes, you should call the same DIV and destroy the FullPage, so you managed to call in another div again.

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

Working - https://codepen.io/alvarotrigo/pen/bdxBzv



标签
易学教程内所有资源均来自网络或用户发布的内容,如有违反法律规定的内容欢迎反馈
该文章没有解决你所遇到的问题?点击提问,说说你的问题,让更多的人一起探讨吧!