Fullpage.js Slide horizontal on scroll

后端 未结 2 628
悲哀的现实
悲哀的现实 2020-12-14 10:36

Im using fullpage.js to achieve vertical and horizontal scroll.

i want the slider to slide when i scroll on Section 2.

Functionality similar to this website

2条回答
  •  醉酒成梦
    2020-12-14 11:19

    Finally got it working :

    var slideIndex  = 1,
    sliding     = false;
    

    $(document).ready(function() {

    $('#fullpage').fullpage({
    
        sectionsColor: ['#1bbc9b', '#4BBFC3', '#7BAABE', 'whitesmoke', '#ccddff'],
        scrollingSpeed:1000,
        css3: true,
    
        onLeave: function(index, nextIndex, direction) {
    
            if(index == 2 && !sliding) {
    
                if(direction == 'down' && slideIndex < 5) {
    
                    sliding = true;
                    $.fn.fullpage.moveSlideRight();
                    slideIndex++;
                    return false;
    
                } else if(direction == 'up' && slideIndex > 1) {
    
                    sliding = true;
                    $.fn.fullpage.moveSlideLeft();
                    slideIndex--;
                    return false;
    
                }
    
            } else if(sliding) {
    
                return false;
    
            }
    
        },
    
        afterSlideLoad: function(anchorLink, index, slideAnchor, slideIndex) {
    
            sliding = false;
    
        }
    
    });
    

    });

提交回复
热议问题