Anna Shahinyan
Anna Shahinyan

Reputation: 1

How to stop doing 1st function after 2nd?

$("#zoom").css({
        "width" : "400px",
        "height" : "190px", 
        "background"  : "grey"
    })
    $("#zoom").click(function(){
        $("#zoom").animate({
            width : '50px',
            height : '50px'
        },1000); 
        }) 
    });
    $("#zoom").click(function(){
            $("#zoom").animate({
                width : '400px',
                height : '190px'
            },1000)

I have div id = "zoom". I need to make it smaller when I click on it and make it big(400, 190) again when I click on it second time. When I click on it first time it does its first function normally, but after I click second time it does second function with first function. How can I fix it?

Upvotes: 0

Views: 39

Answers (1)

bryan60
bryan60

Reputation: 29335

use a variable:

var isBig = true;
$("#zoom").click(function(){
  if (isBig) {
    $("#zoom").animate({
        width : '50px',
        height : '50px'
    },1000); 
    isBig = false;
  } else {
    $("#zoom").animate({
      width : '400px',
      height : '190px'
    },1000)
    isBig = true;
  }
}) 

Upvotes: 1

Related Questions