Question

i want to use .animate function but i have some problems i want to change the ‘left’ value but i don’t know the width of the item that i will move so if i sent to animate timer to 1000 and the width of my item is 100px that will be different if the width of my item is 500px and for the animate when it comes near the end of it’s target it become faster, is there anyway to move my item without worrying about speed and timeout ?

Answer 1

If I understand you correctly, you want to change the left of the item you are animating, but you want it to move at a constant speed, not complete in a constant time. In fact moving an item at a constant speed is the default way of animating in javascript (setInterval, setTimeout, etc.) JQuery is a shortcut for the people who don’t want to do the tedious calculations involved in the (more frequent) case of wanting a transition to occur in constant time.

So, two ways you can do it. One: Don’t use JQuery for that animation. Use setInterval or setTimeout with a Date difference check. Two: Use JQuery but calculate the width so you can reverse calculate the time duration. You can get the width of any JQuery object with .width(). From this you can calculate the distance that needs to be traveled and divide that by the speed (pixels per second) you want to stay constant to get the time to plug into the JQuery animate function. Make sense?