JQuery animimate: changing speed while working

I have a sliding div and a few buttons that will start the animation at different speeds (using different values ​​for the duration).

The buttons look something like this: [Left x2] [Left x1] [Left x0.5] [Right x0.5] [Right x1] [Right x2]

My code currently looks like:

  //leftVal is set based on where the div is currently placed
  //timeLeft is set based on which button is "on hover"  

  $('#content-holder').animate({       
    "left": leftVal        
  }, {queue:false, duration:(timeLeft), easing:"quadEaseOut"});       

This is good in Chrome, but in other browsers such as IE, this leads to lively animations, and you can noticeably see the scroll of the div stop for a second before continuing at a new speed.

I have the feeling that the best way to achieve speed with variable speed is to directly affect the duration of the animation without killing it and not starting a new one, but I'm not sure if this is possible. Any tips?

+3
1

, :

$('#content-holder').stop().animate({       
"left": leftVal
}, {queue:false, duration:(timeLeft), easing:"quadEaseOut"});

.stop() , . (http://api.jquery.com/stop/)

, - .

, , , . , "" .

, , , , .

, , !

+1

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


All Articles