StackOverflow2013

Note that there are some explanatory texts on larger screens.

plurals

POPrevent input until first action finishes?
text
Body
copied!<p>In my code I have a div that moves left and right when buttons are pressed. However, when I press the button multiple times it moves respective to the number of presses. What I want it to do is prevent any input to be given ( or the button to be pressed ) until after the animation has finished.</p> <p>I tried using a delay to keep the actions from 'queuing' but that simply put them off by a few seconds.</p> <p>Here is my code* currently as well as a jsfiddle example of the idea: <a href="http://jsfiddle.net/Sjfuv/" rel="nofollow">http://jsfiddle.net/Sjfuv/</a> (Yes they are different, the example is not made by myself)</p> <pre><code>jQuery(document).ready(function($) { var clickState = 0; var cssForState = [{ 'margin-left': '0px' },{ 'margin-left': '-850px' },{ 'margin-left': '-1700px' }]; var advanceToNextClickState = function() { clickState++; if (clickState >= cssForState.length) clickState = 0; }; var previousClickState = function() { clickState--; if (clickState < 0) clickState= 2; }; $('.RButton').click(function (e) { console.log("Received click while clickState = " + clickState); advanceToNextClickState(); $('.slideContain').delay(150).animate(cssForState[clickState]); }); $('.LButton').click(function (e) { console.log("Received click while clickState = " + clickState); previousClickState(); $('.slideContain').delay(150).animate(cssForState[clickState]); }); }); </code></pre> <p>*S/O to the user who helped me on my last question too, I like the way this works ^_^</p>

Querying!

Guidance

An individual column

Larger individual text columns get their own page to allow for proper reading.

SQuiL has stopped working due to an internal error.

If you are curious you may find further information in the browser console, which is accessible through the devtools (F12).

Reload