jQuery - wait until function is finished

[fall3n]

I have a slider which on click of a link performs a function. The problem I have is if you click it multiple times it goes haywire. I need to tell the function to not perform any calculations until the previous is done. Or just not perform anything at all if a function is currently animating. I know there is a callback function, but I'm not sure if this is the right thing to use and how to use it. Can anyone enlighten me?

[Dick Montage]

Look at queuing!!!

[fall3n]

Cheers, I'll give this a shot...

[fall3n]

Hmmm, not sure if I'm fulling wrapping my head around this. I get what it can do, but is this only for animations? What I have is a function that calculates the current position and how far it has to move the object. The problem is if you click the arrow more than once it calculates based off of the position the animation is currently at. I need it to wait until the function is done before performing the next.

Here's an example. While it's not the exact same thing I'm currently working on, it has the same issue. Try click next multiple times... http://mirrorcreative.net/

[Mike]

Something simple like this:

var running = false;
function foo()
{
  if (running == true) return;

  running = true;

  // the code

  running = false;
}

[sweetsam]

Something simple like this:

var running = false;
function foo()
{
  if (running == true) return;

  running = true;

  // the code

  running = false;
}

In addition to Mike's post since this is something that will need to be active for the next click you can use a setTimeout to return running to false and set the timer to time required for the animation to complete.

At the moment it appears you are keeping track of position using the scroll left value. This can be a problem if the next click happens in the middle of an animation as it is right now. Sometimes it can be a problem to make the user wait till the animation completes since they may want to take a quick look. So I would recommend recording the stop positions when the dom is ready and then keeping track of clicks to decide where to stop.

[fall3n]

At the moment it appears you are keeping track of position using the scroll left value. This can be a problem if the next click happens in the middle of an animation as it is right now. Sometimes it can be a problem to make the user wait till the animation completes since they may want to take a quick look. So I would recommend recording the stop positions when the dom is ready and then keeping track of clicks to decide where to stop.

Exactly right. Can you explain your recommendation a bit further?

[sweetsam]

Say you have three div's with widths 100, 150, 200 pixels. Setup a function that monitors number of clicks which resets to zero in this case after 2 clicks. Setup an array with stops when the dom is ready as below...

1 -> 100

2 -> 250

where first column is clicks and second column is scroll left values. So now click counter will control the scrolling and the counting is instantaneous avoiding errors in detecting current state. I hope I make sense.

Exactly right. Can you explain your recommendation a bit further?

[Gangsta]

You *could* just deactivate the link at start of animation and as a callback, reactivate the link :)