Установите высоту всех элементов равномерно

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();
  }
});

вот моя скрипка

Что я могу сделать?

Изменить: я только хочу, чтобы высота всегда была одинаковой для обоих div'ов.

когда div 1 высота меняется js/jQuery должен установить ту же высоту в div 2,

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

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

<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>

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);
  }
});