Jquery SlideUp高度

时间:2013-03-13 09:16:10

标签: jquery height slideup

$(document).ready(function() {
    $('#arrow').click(function () {
        if ($('#slide1').is(":hidden")) {
            $('#slide1').slideDown('medium');
        } else {
            $('#slide1').slideUp('normal');   
        }
    });
});

我怎么能单独提到滑动高度?

2 个答案:

答案 0 :(得分:3)

 $('#arrow').click(function () {
      if ($('#slide1').hasClass("small")) {
         $('#slide1').animate({"height": "40px"}, "medium").removeClass("small"); 
      } else {

            $('#slide1').animate({"height": "20px"}, "medium").addClass("small");
      }
  });

您可以使用animate方法更改height。和hasClass方法来检查div的条件(它是否是原始大小)。在这里,我添加了一个“小”类来表示减少的高度状态。

click here for the jsfiddle

答案 1 :(得分:0)

使用animate()

$(document).ready(function() {
  $('#arrow').click(function () {
      if ($('#slide1').is(":hidden")) {
       $('#slide1').animate({"height": "100px"}, "medium");
      } else {
       $('#slide1').animate({"height": "0px"}, "medium");;   
      }
  });
});

查看toggle()(虽然在jq 1.9中已弃用并删除),fadeToggle()