JQuery move div when flipping?

Sorry if this is not easy, I'm new to jQuery. I am using the Flip plugin ! to rotate the div into place. I would also like to move the div while it rotates. I am currently doing this:

        $("#flipDiv").flip({
            direction:'lr',
            content:newContent
        });
        $("#flipDiv").animate({
            'marginLeft' : "+=150px"
        });

It flips the div, but the animation does not start until the flipping is completed, and even then everything will go right away. Since I am not very familiar with javascript, I do not know if this is a limitation of the language or this particular plugin, or if I am just doing it wrong. Does anyone know how best to do this?

+3
source share
2 answers

, flip animate , , . , , .

, :

$("#flipDiv").flip({
 direction:'lr',
 content:newContent
});
$("#flipDiv").animate({
 'marginLeft' : "+=150px"
}, {queue: false});

. API animate, queue dequeue.


: , . , , flip (#flipDiv ), -, -, div . , , div, , .

, onBefore :

$("#flipDiv").flip({
  direction:'lr',
  content:newContent,
  onBefore: function(clone) {
    clone.animate({ 'marginLeft' : "+=150px" }, {queue: false});
  })
});

, div, , , div , . , ( ) , , marginLeft , , .

+2
$("#flipDiv").flip({
    direction:'lr',
    content:newContent,
    onAnimation: function(){
         $(this).animate({
               left: '+=150px'
         });
    }
})

onBefore onAnimation, , , .

+1

Source: https://habr.com/ru/post/1733107/


All Articles