0

我设置与 css 维度共享相同的类名。单击特定的<div>i
将其填充到屏幕宽度和高度并覆盖其他<div>s. 它工作正常。但问题是当我再次点击时，我失去了原来的尺寸以恢复到原来的大小。下面是我的代码：

 var isFullscreen = false;
  $('.item').click(function(){
    var d = {};
    var speed = 900;
    if(!isFullscreen){ // MAXIMIZATION
        d.width = $(window).width();;
        d.height = $(window).height();; 
        isFullscreen = true;
        $('.item').hide();
        $(this).show();
        $(this).animate(d,speed)    
    }
    else{ // MINIMIZATION            
        **d.width = $(this).css('width');**
        **d.height = $(this).css('height');**            
        isFullscreen = false;
        $(this).animate(d,speed);
        $('.item').show();
    }
    })

我试图通过保存其原始尺寸并在第二次点击时使用它们来使用类似于静态变量的东西。而且我看到javascript中没有静态变量。那么如何实现这一点。

4

3 回答 3

0

You're currently re-declaring the d variable each time the item is clicked to be an empty object. If you move the var d = {} declaration to outside the click function then you'll be able to do it.

于 2012-10-04T16:53:30.430 回答
0

尝试使用原型属性。这确保它的添加实例具有与其关联的相同值。

function d(){
}

d.prototype.width=$(window).width();
d.prototype.height=$(window).width();
于 2012-10-04T17:06:20.737 回答
0

我可以通过在调整大小之前保存我的高度和宽度并稍后使用它们来做到这一点：下面是我修改后的代码：你可以弄清楚，我在这些行中添加了 **....

var isFullscreen = false;
  var d = {};
  **var test = {};**
  $('.item').click(function(){
    var speed = 900;
    if(!isFullscreen){ // MAXIMIZATION
        **test.width = $(this).css('width');**
        **test.height = $(this).css('height');**
        d.width = $(window).width();
        d.height = $(window).height();
        isFullscreen = true;
        $('.item').hide();
        $(this).show();
        $(this).animate(d,speed)    
    }
    else{ // MINIMIZATION            
        d.width = test.width;
        d.height = test.height;            
        isFullscreen = false;
        $(this).animate(d,speed);
        $('.item').show();
    }
})

谢谢大家的支持。

于 2012-10-04T18:42:33.133 回答