blasteralfred Ψ blasteralfred Ψ - 5 months ago 25
jQuery Question

toggle width resize animation - jquery

I have

<div id="test"></div>
and
<a id="trigger"></a>
. Div has width 300px. I want the div to re size it's width to 100px when user click trigger and want to re size to previous size when user again click the trigger. How can i make this using jquery??

Thanks in advance...
:)


blasteralfred

Answer

Assign a variable of 1 for click and 0 for unclick and then use the .click function as follows:

$(document).ready(function(){
  TriggerClick = 0;

  $("a#trigger").click(function(){
    if(TriggerClick==0){
         TriggerClick=1;
         $("div#test").animate({width:'100px'}, 500);
    }else{
         TriggerClick=0;
         $("div#test").animate({width:'300px'}, 500);
    };
  });
});