Alin
Alin

Reputation: 1228

Resize div on click to fit window (working)and resize back on second click (not working)

I have a code that allows me to resize W&H of a container to match the window W&H on click, and it's working great, also I want it to resize back on second click but that's not working for me so far...

Here's what i got and a half working jsFiddle:

$('.more').click(function(){
    var isFullscreen = false;
    var d = {};
    var speed = 900; 
    if(!isFullscreen){ // MAXIMIZATION
        d.width = $(window).width();;
        d.height = $(window).height();; 
        isFullscreen = true;
    }
    else{ // MINIMIZATION            
        d.width = "50px";
        d.height =  "50px";            
        isFullscreen = false;
    }

    $(this).animate(d,speed)
    })

Upvotes: 0

Views: 135

Answers (1)

vernonner3voltazim
vernonner3voltazim

Reputation: 786

Ummmm...your click function always starts by initializing isFullscreen to false (never takes the 'else' branch). You could make isFullscreen a global variable; move its declaration and intialization outside the function. If it is supposed to be a 'static' type of variable, you need to initialize it rather differently (starting with giving that click function a name), perhaps:

 $('.more').click(function f(){
   f.isFullscreen = (f.isFullscreen===false)?true:false;

The very first time the function is called, f.isFullscreen is undefined (not identical to false) so gets set to false. On subsequent calls its value flips, so you don't need the individual lines that set its value in your MAXIMIZATION and MINIMIZATION code blocks.

Upvotes: 1

Related Questions