CODEWITHSUNDEEP
flexslider
Zorkzyd
Zorkzyd

Reputation: 1029

Flexslider - Navigation "one-by-one" - one click on arrow / one swipe / one keypress = movement of only one image

I'm using Flexslider for a project of gallery and I want to modify the navigation system. On keypress/swipe/click on arrows, four images displayed disappear and are replaced by four new.

Is it possible to modify the behavior of the navigation to move images one by one ?

Thank you very much for your help !

Z.

Upvotes: 3

Views: 3614

Answers (1)

ivan.mylyanyk
ivan.mylyanyk

Reputation: 2101

You may want to use property move, which is defined as

//{NEW} Integer: Number of carousel items that should move on animation. If 0, slider will move all visible items.

So, your code will look like this

$(window).load(function() {
    $('.slidewidget1').flexslider({
         animation: "slide",
        animationLoop: true,
        itemWidth: 210,
        controlNav: false,
        itemMargin: 0,
        slideshow: false,
        move: 1,
        minItems = 4,
        maxItems = 4
    });  
});

plus, of course, your customization of width, etc.

Documentation

Upvotes: 3

Related Questions