here is my situation,
I'm triggering some functions on click like this:
on first click, trigger function A. On second click, trigger function B, On third click, trigger function C, etc etc
All the click are on the same div ( body).
However, I would like the second click to trigger only one the first function is finish. ( all the functions are some animations)
Then the thrid click, to trigger only when the second function is finish, etc, etc.
I'm using the code below to have multi click:
var clickCounter = 0;
$("#body").click(function() {
clickCounter++;
switch (clickCounter) {
case 1:
showpanel();
setTimeout(function() {
hidepanel();
}, 1820);
setTimeout(function() {
movetotop();
}, 1820);
setTimeout(function() {
movetotopheight();
}, 1820);
setTimeout(function() {
nav();
}, 1820);
break;
case 2:
centralbutton();
break;
case 3:
footerarea();
break;
case 4:
side();
break;
}
});
Any pointers / help to achieve this will be really fantastic !!
Thanks so much
You can do something like this by updating the counter in the functions when the function is done, while running set counter to 0 so no action will be triggered.
https://jsfiddle.net/3u177cs3/