FullPage with ScrollOverflow選項，當來自上面的部分需要開始從底部滾動

我想知道是否有一種方法可以使用FullPage和Scrolloverflow選項來完成更大的部分。我有幾個部分，其中一些是可以滾動的;FullPage with ScrollOverflow選項，當來自上面的部分需要開始從底部滾動

如果我向下滾動部分，一切都按預期工作，autoScrolling打開，我從部分跳轉到部分，並在部分更大的情況下在部分內滾動。到現在爲止還挺好！ :)
問題如下;
當我使用錨或導航移動到最後一節，例如fullPage渲染後。然後向上滾動到可滾動部分，它不顯示從底部的整個部分，但隱藏滾動元素之外的部分，並從頂部開始部分...
我很樂意基本能夠當我們使用錨或導航跳到可滾動部分下面的部分，然後向上滾動，我們將從底部開始滾動部分。

我試圖通過使用CSS3從上面的部分來強制滾動底部，但問題是，在此之後，當我向上滾動它跳轉到上面的部分，並不滾動到第一節的頂部和然後跳到上面的部分...

任何建議？...希望對自己有意義

$('#fullpage').fullpage({ 
    sectionsColor: ['yellow', 'orange', '#C0C0C0', '#ADD8E6'], 
    navigationTooltips: ['one', 'two', 'three', 'four'], 
    navigation: true, 
    navigationPosition: 'right', 
    fitToSection: false, 
    scrollOverflow:true, 
    onLeave: function(index, nextIndex, direction){ 
     if((nextIndex == 2) && (direction =='up')) { 
     var scrollToBottom = $('.fp-scroller').height() - $(window).height(); 
     $('.fp-scroller').css({ 
      'transform' : 'translate(0px, -' + scrollToBottom + 'px) translateZ(0px)' 
     }); 
     } 
    }, 
});

JS FiDDLE

來源

2016-11-17 tomdelalune

你必須處理它在'afterRender'回調中。正如[你開的github主題]（https://github.com/alvarotrigo/fullPage.js/issues/2417）中所建議的那樣，你將需要使用[iScroll方法]（http://iscrolljs.com/ ）來處理它。 – Alvaro

由於阿爾瓦羅的提示在上面的評論。我只好用IScroll方法，但使用它的後負荷回調和「FP-自動高度」類添加到「滾動」部分

http://jsfiddle.net/photous/qn084vmn/

$('#fullpage').fullpage({ 
    sectionsColor: ['yellow', 'orange', '#C0C0C0', '#ADD8E6'], 
    navigationTooltips: ['one', 'two', 'three', 'four'], 
    navigation: true, 
    navigationPosition: 'right', 
    fitToSection: false, 
    scrollOverflow:true, 
    afterLoad: function(anchorLink, index){ 
     var loadedSection = $(this); 
     var nextSection = loadedSection.next(); 
     var prevSection = loadedSection.prev(); 
     if(nextSection.hasClass('fp-auto-height')) { 
     var IScroll = nextSection.find('.fp-scrollable').data('iscrollInstance'); 
     IScroll.scrollTo(0, 0, 0) 
     } 
     if(prevSection.hasClass('fp-auto-height')) { 
     var IScroll = prevSection.find('.fp-scrollable').data('iscrollInstance'); 
     IScroll.scrollTo(0, IScroll.maxScrollY, 0) 
     } 
} 

});

來源

2016-11-21 16:40:29 tomdelalune

FullPage with ScrollOverflow選項，當來自上面的部分需要開始從底部滾動

回答

相關問題