Der Versuch, FullPage.JS nach dem Scrollen durch den Helden zu initialisieren

Question

Der Versuch, FullPage.JS nach dem Scrollen durch den Helden zu initiieren. Gerade jetzt, wenn Sie an dem Helden vorbeirollen - FullPage wird initialisiert und scrollt weiter durch die Folien mit dem Schwung des ersten Scrolls. Ich habe diese Funktion inplace für meine init.

function initFullPage(){ 
    $(".view-case-study").addClass("projects-load"); 
    $(".pagination").addClass("visible"); 
    $(".logo-menu svg").toggleClass("hovered"); 

    $('#fullpage').fullpage({ 
    lazyLoading:false, 
    navigation: true, 
    navigationPosition: 'right', 
    css3:true, 
    normalScrollElementTouchThreshold: 5, 
    touchSensitivity: 10, 
    anchors: a_anchors, 
    menu: '#myMenu', 
    normalScrollElements: '.nav, .open-nav, .project-inner, .work-mode, .menu-shelf, .tab, .view-case-study, #hero, .hero-center-container', 
    afterLoad: function(anchorLink, index){ 
    var loadedSection = $(this); 
    projectUrl = loadedSection.data('url'); 
    project_title = loadedSection.data('title'); 
    loadedSection.addClass('projects-load'); 
    loadedSection.find(".full-line").animate({'width':'100%'},500); 
    loadedSection.animate({'background-position-y':'-20px','background-size':'120%'},1000); 
    $('#hero').animate({'opacity':'0'},1000); 
    $('#hero').addClass('destroy'); 
    $('.ui-info').animate({'opacity':'1'},350); 
    }, 
    onLeave: function(index, nextIndex, direction){ 
    var leavingSection = $(this); 
    leavingSection.removeClass('projects-load'); 
    leavingSection.find(".full-line").animate({'width':'0%'},250); 
    leavingSection.animate({'background-position-y':'0px','background-size':'110%'},100); 
    $('#project-inner-container').animate({scrollTop:0},0); 
    $('.ui-info').animate({'opacity':'0'},0); 
    } 
    }); 
fullPageInit = true; 
} 

Unten ist mein Held Scroll-Skript. Ich habe versucht, das Skript zu initialisieren und stumm zum ersten Abschnitt, aber es will nicht hören.

var winHeight = $(window).height(); 
$(window).scroll(function() { 

    var scrTop = $(document).scrollTop()/winHeight, 
     scrTopFixed = scrTop.toFixed(2), 
     scrTransform = scrTopFixed * 80, 
    bgPos = scrTransform/10 + 95, 
    heroOpacity = 1 - scrTransform/100; 

if ((scrTransform >= 80) && (fullPageInit == false)) { 
    initFullPage(); 
    $.fn.fullpage.silentMoveTo('#sidepocket'); 
} 

    $('svg.scroll-end').css({ 
     'clip': "rect(0px," + scrTransform + "px,200px,0px)", 
    }); 

}); // Close 

Answer 1

// Scroll SVG Hero 

    $('#scroll-control').on('scroll',function(e){ 
    var totalScroll = $('#scroll-control').scrollTop(); 
    var slowScroll = totalScroll * .2; 
    console.log(slowScroll); 
    $('svg.scroll-end').css({ 
     'clip': "rect(0px," + slowScroll + "px,200px,0px)", 
    }); 
    if(totalScroll > 400){ 
     if((fullPageInit == false) && (workPage == false)){ 
     fullPageInit = true; 
     $('#hero').animate({'opacity':'0'},300,function(){ 
      // remove scroll listener 
      $('#scroll-control').off(); 
      // set first project DOM 
      var wh = window.innerHeight ? window.innerHeight:$(window).height(); 
      $('#fullpage section').height(wh); 
      var loadedSection = $('#fullpage section:first-child'); 
      projectUrl = loadedSection.data('url'); 
      project_title = loadedSection.data('title'); 
      loadedSection.addClass('projects-load'); 
      loadedSection.find(".full-line").animate({'width':'100%'},500); 
      history.pushState(null, null, '#'+projectUrl); 
      loadedSection.animate({'background-position-y':'-20px','background-size':'120%'},1000,function(){ 
      initFullPage(); 
      $('#scroll-control').hide(); 
      }); 

      $('.ui-info').animate({'opacity':'1'},350); 
     }); 
      $('#hero').addClass('destroy'); 
     } 
    } 
    }); 

    var winHeight = $(window).height(); 

    $(window).scroll(function (e) { 
     console.log(e); 
     var scrTop = $(document).scrollTop()/winHeight, 
      scrTopFixed = scrTop.toFixed(2), 
      scrTransform = scrTopFixed * 80, 
     bgPos = scrTransform/10 + 95, 
     heroOpacity = 1 - scrTransform/100; 
    if ((scrTransform >= 80) && (fullPageInit === false)) { 
    } 

    }); // Close 

Die Frage eine Zeit durch die Festlegung von Fest wurde, so dass bis zum Fullpage Scrollen der Maus Ende nicht initialisieren, Sie Overscroll oder einen Impuls hat daher nicht, dass der Benutzer zum nächsten zwingt Sektion.

Hope this andere versuchen, bauen benutzerdefinierte Skripts in FullPage.JS

https://www.alexcoven.com