Question

这里的代码打开一个div并激活它..对吧？是的，这对我很有用......

jQuery("a.trigger").click(function(){
    $("#main").animate({
      height: "+=300px"
    }, 1500 );
    return false;
});

我的问题是，我该如何切换它？我可以打开它，但我如何关闭它...意味着......滑动200px的高度。你懂我的意思吗？我点击“阅读更多”（a.trigger）并且它的高度为+ 200px ..但我也希望将其重新设置为-200px。

我被困了因为我不是一个jquery专家。我尝试使用SlideToggle或切换，但它对我不起作用....

谢谢你的帮助！

Answer 1

通过设置一个持有状态的类

来设置

jQuery("a.trigger").click(function(){
    if (!$("#main").is(".open")) {
        $("#main").animate({
            height: "+=300px"
        }, 1500 ).addClass('open');
    } else {
        $("#main").animate({
            height: "-=300px"
        }, 1500 ).removeClass('open');
    }
    return false;
});

Answer 2

您正在寻找切换功能。

jQuery("a.trigger").toggle(function(){
  $("#main").animate({
    height: "+=300px"
    }, 1500 );
    return false;
  }, function(){
  $("#main").animate({
    height: "-=300px"
  }, 1500 );
  return false;
});

Answer 3

jQuery("a.trigger").toggle(function()
{
    $("#main").animate (... height+=300));
}, function()
{
    $("#main").animate (... height-=300));
});

或者你可以使用slideToggle：

jQuery("a.trigger").click(function(){ $("#main").slideToggle(); });

Answer 4

如果我正确阅读，那么这就是你想要做的。

http://jsfiddle.net/JqN4p/

Answer 5

jQuery("a.trigger").click(function(){
   if( $("#main").hasClass('active') )
        value  = -300;
   else
      value = 300; 
    $("#main").addClass('active').animate({
      height: "+=" + value + 'px'
    }, 1500 );
    return false;
});

这是一个工作小提琴 http://jsfiddle.net/QVJPZ/

Answer 6

jQuery slideToggle将很好地为您完成此任务：

$('a.trigger').click(function() {
  $('#main').slideToggle('slow', function() {
    // Animation complete.
  });
});

http://api.jquery.com/slideToggle/

JQuery切换帮助

6 个答案: