I have a page with the several divs like:
By default all are display:none, and I let the user click to show a certain card.
Every time the user clicks to load a card I run the following JQUERY:
$('.carditem').fadeOut( function() {alert(1)
// Animation complete show correct card
$('#' + toogleID).fadeIn();
});
What's surprising me is that the alert above is happening 5 times, not 1 time. Meaning the fadeOut isn't running Simultaneously but looping over all the card items. This makes for a ugly animation that blinks. How can I get fadeout for all the matching classes to run at the same time? Or just run on the classes that have divs that are displaying, which should only be 1 card?
Thanks!