CODEWITHSUNDEEP
javascriptjqueryswitch-statement
mr_skeltal
mr_skeltal

Reputation: 37

Switch not working

This is my first question here, please don't get mad if it's stupid... So I've got this block of code, and it isn't working:

var clicks = 0;

$('body').click(function(){
    clicks ++;
    console.log(clicks);
});

switch(clicks){
       case 1:
       $('#contentlist1').fadeIn(50);
       break; 
       case 2:
       $('#contentlist2').fadeIn(50);
       break;   
       case 3:
       console.log("this is 3");
       break;           
       case 4:
       $('#contentlist4').fadeIn(50);
       break;   
       };

What I want to do is let elements fade in one after each other on each subsequent click, like powerpoint bulletpoint animations, but it isn't working.

I've changed the fadeIn to console.log('message') etc. to see if it was the fadein that's broken, but I think the switch doesn't work, not the fade. (the elements are already faded out, so the fade should work properly).

What's wrong with this code? I've looked at some sources and it shouldn't be because 'clicks' is an integer value.

Upvotes: 0

Views: 91

Answers (1)

Ayman El Temsahi
Ayman El Temsahi

Reputation: 2610

Your switch statement should be inside the click function and you should check when clicks is more than the max cases, 

var clicks = 0;

$('body').click(function() {
    if(++clicks > 4) clicks = 1;

    switch (clicks) {
        case 1:
            $('#contentlist1').fadeIn(50);
            break;
        case 2:
            $('#contentlist2').fadeIn(50);
            break;
        case 3:
            console.log("this is 3");
            break;
        case 4:
            $('#contentlist4').fadeIn(50);
            break;
    };
    console.log(clicks);
});

Upvotes: 2

Related Questions