Question

我在div中有一个向下滑动和向下滑动的动画。

当下拉列表打开时，div的高度为124px，而其为20px。我有另一个div，当动画div的下拉高度时，其高度应该等于第一个div的高度。

我正在使用jquery 1.11.0

这是我的代码：

$( ".dropdown" ).hide();
$('.title').on('click', function(){
  var element = $(".dropdown");
  if (element.hasClass('open')) {
    element.removeClass('open');
    element.slideUp();
  }
  else {
    element.addClass('open');
    element.slideDown();
  }
});

here is my fiddle

我该怎么办？

修改我只想让div的高度始终相同。

当div 1高度发生变化时，js / jQuery应将高度设置为div 2。

＆＃13;

$(".dropdown").hide();
$('.title').on('click', function() {
  var element = $(".dropdown");
  if (element.hasClass('open')) {
    element.removeClass('open');
    element.slideUp();
  } else {
    element.addClass('open');
    element.slideDown();
  }
});

＆＃13;

.d1 {
  border: 1px solid #333;
}
.d2 {
  border: 1px solid #333;
}
.title {
  cursor: pointer;
}

＆＃13;

<script src="https://ajax.googleapis.com/ajax/libs/jquery/1.11.1/jquery.min.js"></script>
<div class="d1">
  <a class="title">title(click here)</a>
  <ul class="dropdown">
    <li>aaaa</li>
    <li>aaaa</li>
    <li>aaaa</li>
    <li>aaaa</li>
  </ul>
</div>
<br/>
<div class="d2">
  <a>victim</a>
</div>

＆＃13;

Answer 1

这对你来说很完美：

var slideDown = $("#d1").height();
$( ".dropdown" ).hide();
var slideUp = $("#d1").height();
$('.title').on('click', function(){
  var element = $(".dropdown");
  if (element.hasClass('open')) {
    element.removeClass('open');

    element.slideUp(400, function(){});
    $("#d2").animate({height:  slideUp}, 500);

  }
  else {
    element.addClass('open');
    element.slideDown(400, function(){});
    $("#d2").animate({height:  slideDown}, 500);

  }
});

<强> JSFiddle

Answer 2

$( ".dropdown" ).hide();
$('.title').on('click', function(){
  var element = $(".dropdown");
  if (element.hasClass('open')) {
    element.removeClass('open');    
    element.slideUp();
      -get the height of the dropdown 
    // var elHeight = $('.dropdown').css('height') + 'px';
     -apply height to other div
    // $('.otherdiv').css("height",elHeight)
  }
  else {
    element.addClass('open');
    element.slideDown();
    // var elHeight = $('.dropdown').css('height') + 'px';
    // $('.otherdiv').css("height",elHeight);
  }
});

均匀设置所有div的高度

2 个答案: