Question

我正在测试jQuery（我对编程很新）我发现每当我运行代码来隐藏元素时，jQuery就会把它变大（高度）然后隐藏它。它看起来很乱，因为不包括bootstrap和reset .css文件，但是有或没有它们会发生错误。

<div class="nav">
  <div class="container">
    <div class="pull-left">
      <span>test1</span> test2</div>
    <ul class="pull-right">
      <li class="nav-button">button1</li>
      <li class="nav-button">button2</li>
      <li class="nav-button">button3</li>
      <li class="nav-button">button4</li>
    </ul>
  </div>
</div>

.nav .container {
  background-color: red;
}

.pull-right li{
  display: inline;
}

.pull-right{
  padding-bottom: 0px;
  margin-bottom: 0px;
}

$(document).ready(function() {

  $('.nav-button').hide(1000);


});

知道为什么吗？感谢

Answer 1

这是因为您正在使用的jQuery动画在动画持续时间内将元素设置为overflow:hidden，这会以不同的方式显示对象。

以下是该问题的JsFiddle演示：https://jsfiddle.net/ed0xd76r/13/

这是已知问题，最好描述为in this Stack Overflow question.

jQuery在隐藏它之前使一个元素更大？

1 个答案: