Question

出于某种原因，当我尝试使用.animate在两个大小之间切换div时，它只是消失而不是缩放到我想要的大小。我在很多方面都使用了所有的语法和小东西，但没有任何作用。这是我使用过的jquery和一堆乱七八糟的东西。

$("#expandable").click(
    function() {
        $("#expandable").toggle(
            function() {
                $("#expandable").animate(
                    {width:600, height:600}
                )
            },
            function() {
                $("#expandable").animate(
                    {width:400, height:200}
                );
            }
        );
    }
);

我有一个jsfiddle在这里供您查看。 http://jsfiddle.net/justinbc820/qt7GV/

Answer 1

http://api.jquery.com/toggle/

描述：显示或隐藏匹配的元素。

var on = false;
var box = $("#expandable");
box.click(
    function() {

        if (on = !on) { 
            box.animate(
                    {width:600, height:600}
                )
        } else {
            box.animate(
                    {width:400, height:200}
                );
        }            

    }
);

Answer 2

根据http://api.jquery.com/toggle-event/

注意：此方法签名在jQuery 1.8中已弃用，在jQuery 1.9中已删除。 jQuery还提供了一个名为.toggle（）的动画方法，可以切换元素的可见性。是否触发动画或事件方法取决于传递的参数集。

Here是一种方法

$('#expandable').data('flag', true);
$("#expandable").click(
  function() { 
    $("#expandable").animate(
        $(this).data('flag') 
        ? {width:600, height:600}
        : {width:400, height:200}
    )
    $(this).data('flag', !$(this).data('flag'));
  }
);

Answer 3

不使用切换功能尝试

<强> http://jsfiddle.net/qt7GV/9/

$(document).ready(function(){
  $("#expandable").click(function(){
      var divheight = $(this).height();
      if (divheight == 400)
      {
          $(this).animate({height:'150px', width:'150px' });
      }
      else
      {
          $(this).animate({height:'400px', width:'400px' });
      }
  });
});

Answer 4

看看这个http://jsfiddle.net/qt7GV/4/

$("#expandable").click(function() {

    if ($(this).width() < 600) {
         $(this).animate(
             {width:600, height:600}
         )
    } else {
        $(this).animate(
            {width:400, height:200}
        );
    }
});

Div animate消失了，而不是调整大小

4 个答案: