I've got several functions set to different timeouts that are called on any button click. For some reason, all of them don't execute on the first click.
www.bobbysimmonspro.com
Also, as a sidebar, i'll gladly hear any opinions about the way i'm approaching this, plugins to simplify, and general tips or helpful links on the process of debugging something like this.
$( document ).ready(function() {
var panelClassName = 'show-front';
$("#cube").toggleClass("backFace");
setTimeout(function(){
$("#show-buttons").on('click', '*', function() {
$("#cube").removeClass("backFace");
$("#cube").animate({opacity: .3});
$("#cube").removeClass( panelClassName );
});
}, 500);
setTimeout(function(){
$("#show-buttons").on('click', '*', function() {
panelClassName = event.target.className;
});
}, 1000);
setTimeout(function(){
$("#show-buttons").on('click', '*', function() {
$("#cube").addClass( panelClassName );
$("#cube").animate({opacity: 1});
});
}, 3000);
setTimeout(function(){
$("#show-buttons").on('click', '*', function() {
$("#cube").addClass("backFace");
});
}, 3500);
});