S
S
SexyMonkey2016-01-23 15:43:41
JavaScript
SexyMonkey, 2016-01-23 15:43:41

OWL Carousel v1. How to programmatically determine whether a slide is moving forward or backward?

OWL Carousel v1.
When switching slides, I need to rotate the adjacent block by a certain angle. Implemented it like this:

$(document).ready(function() {

    var owl = $(".main-slider");

    owl.owlCarousel({
        singleItem: true,
        navigation: true,
        navigationText: false,
        rewindNav: false,
        beforeMove: rotate
    });

    var iter = 0;

    function rotate(){
        var quantity = this.owl.owlItems.length -1;

        iter ++;
        var step = 90/quantity;
        var deg = step*iter;

        $('.test').css({transform: 'rotate('+deg+'deg)'})
    }

});

But I don’t quite understand how to determine the switching back in order to turn the neighboring block in the opposite direction.
How to programmatically determine whether a slide is moving forward or backward?
In what condition to wrap "iter --" ?

Answer the question

In order to leave comments, you need to log in

1 answer(s)
S
SexyMonkey, 2016-01-23
@SexyMonkey

$(document).ready(function() {

    var owl = $(".main-slider");

    owl.owlCarousel({
        singleItem: true,
        navigation: true,
        navigationText: false,
        rewindNav: false,
        afterAction: rotate
    });

    var iter = 0;

    function rotate(){
        var quantity = this.owl.owlItems.length -1;

        var currentItem1 = this.owl.currentItem;
        var prevItem1 = this.owl.prevItem;

        if(currentItem1 > prevItem1){
            iter++;
        }
        if(currentItem1 < prevItem1){
            iter--;
        }

        var step = 90/quantity;
        var deg = step*iter;

        $('.test').css({transform: 'rotate('+deg+'deg)'})
    }

});

Didn't find what you were looking for?

Ask your question

Ask a Question

731 491 924 answers to any question