slider - 切换选项卡会导致动画过程中出现一点变形

Question

我根据标签制作了一个简单的垂直内容滑块，并在制作动画时发现了光学问题。如果您单击不同的选项卡，当前内容会向上滑动，同时新的内容会向下滑动。所有内容具有相同的高度。问题是在动画过程中高度会发生一点变化（关注底部边框）。我真的不知道如何解决它。有什么办法可以预防吗？

这是完整的代码：http: //jsfiddle.net/YGY26/8/

JS：

var active = 1;
function item(id) {
   if (id !== active) {
      $("#description" + active).slideUp("slow");
      if (active !== id) {
         $("#description" + id).slideDown("slow");
         active = id;
      }
   }
}

HTML：

<div class='slider_box' onclick='item(1);'>
   <h3>Content1</h3>
   <div id='description1' class='slider_content' style='display: block'>
      some content to show
   </div>
</div>

<div class='slider_box' onclick='item(2);'>
   <h3>Content2</h3>
   <div id='description2' class='slider_content'>
      some content to show
   </div>
</div>

<div class='slider_box' onclick='item(3);'>
   <h3>Content3</h3>
   <div id='description3' class='slider_content'>
      some content to show
   </div>
</div>

基本 CSS：

.slider_box {
   position: relative;
   width: 330px;
}
.slider_box h3 {
   color: white;
   background: black;
}
.slider_content {
   height: 330px;
   display: none;
}