Seth J. Freeman
Seth J. Freeman

Reputation: 113

JQuery - Animation Being Called Unwillingly

var open = false;

$(".fiveGuysStyle").click(function() {
    if(open == false) {
        $("#top").removeClass("BrotateTop").addClass("rotateTop");
        $("#mid").css("visibility", "hidden");
        $("#btm").removeClass("BrotateBtm").addClass("rotateBtm");

        open = true;
    }
    if(open == true) {
        $("#top").removeClass("rotateTop").addClass("BrotateTop");
        $("#mid").css("visibility", "visible");
        $("#btm").removeClass("rotateBtm").addClass("BrotateBtm");

        open = false;
    }
});

The problem that is occurring is when the btn is being clicked the first if statement is being called but then a split second after the second if statement is being called.

Upvotes: 0

Views: 16

Answers (1)

Himanshu Upadhyay
Himanshu Upadhyay

Reputation: 6565

Its executing because the first if condition is making open variable value true. You should if , else

var open = false;

$(".fiveGuysStyle").click(function() {
    if(open == false) {
        $("#top").removeClass("BrotateTop").addClass("rotateTop");
        $("#mid").css("visibility", "hidden");
        $("#btm").removeClass("BrotateBtm").addClass("rotateBtm");

        open = true;
    }
    else {
        $("#top").removeClass("rotateTop").addClass("BrotateTop");
        $("#mid").css("visibility", "visible");
        $("#btm").removeClass("rotateBtm").addClass("BrotateBtm");

        open = false;
    }
});

Upvotes: 1

Related Questions