How to stop an animate animation with jquery
某草草
某草草 2017-05-16 13:43:21
0
3
571

There are two methods. Execute the turnRight method to control the box to move to the right, and execute the turnLeft method to control the box to move to the left. The box is on the right by default.

function tureRight(){
    $('.k-element-plugs-box').animate({
                marginLeft: "0px"
        },1000,function(){
            console.log("end")
    })
}
    
function tureLeft(eletype){
    $('.k-element-plugs-box').animate({
        marginLeft: "-180px"
    },300)    
 }

In the turnRight method, I added a callback function in the animate animation method to execute console.log("end"). Now there is a problem. When the turnRight method is executed, the box moves to the right for 1 second. Print "end" after the end. If I execute the turnLeft method when the box has not reached the right (that is, the time is not enough for 1 second), it will wait for 1 second before executing the turnLeft method.
If I wrote the JS myself, I know it would be nice to clear the timer, but how does jquery stop the animate animation in turnRight?

某草草
某草草

reply all(3)
阿神

$('.k-element-plugs-box').stop();
tureLeft();

PHPzhong

$('.k-element-plugs-box').stop().animate(), stop the previous animation first, and then execute the next animation

phpcn_u1582

$('xxx').stop() or $('xxx').stop().animate()
stop()’s specific usage and parameter description can be found in the documentation, it will be explained better

Latest Downloads
More>
Web Effects
Website Source Code
Website Materials
Front End Template