Javascript 为什么我的UL在为其父元素设置动画时会消失？

免责声明：我对jQuery和JavaScript比较陌生。只要确定statementTab尚未打开，下面的openStatement函数就会执行。如果下面的代码没有足够的信息，只需查看下面的源代码

基本上，每当用户打开statementTab时，包含各种选项卡的UL就会闪烁并消失。我想解决这个问题

资料来源：

//openStatement函数在用户单击时打开statement选项卡 声明 ULbrochureTab在动画期间被隐藏，因为当explore制作动画时，jQuery将应用一种溢出样式：隐藏到它。动画完成后，此样式将被删除

一个快速的解决方案，也就是说，如果不解决您对其余元素进行样式化的方式，那么将添加样式溢出：可见！重要的浏览。

在动画过程中，ULbrochureTab被隐藏，因为在浏览动画过程中，jQuery应用了一种溢出样式：隐藏。动画完成后，此样式将被删除

一个快速的解决方案，也就是说，如果不解决您对其余元素进行样式化的方式，那么将添加样式溢出：可见！重要的要浏览。

您可以使用CSS top:-45px；在divexplore之外使用ulbrochureTab

无论何时使用jQuery.animate为divexplore设置动画，ulbrochureTab都会闪烁，因为在执行动画时jQuery会自动切换为overflow:hidden

解决方案是使用DIV作为divexplore的包装器，并使其与divexplore上的视觉外观相匹配：

CSS

标记将是：

对于当前的动画方法，无需进行任何更改

要为包装器创建新的CSS，可能需要进行一些调整。

您可以使用CSS top:-45px；在divexplore之外创建ulbrochureTab

无论何时使用jQuery.animate为divexplore设置动画，ulbrochureTab都会闪烁，因为在执行动画时jQuery会自动切换为overflow:hidden

解决方案是使用DIV作为divexplore的包装器，并使其与divexplore上的视觉外观相匹配：

CSS

标记将是：

对于当前的动画方法，无需进行任何更改

为包装器添加新的CSS，可能需要一些调整。

有控制台错误吗？animate以一个数字作为速度参数，而不是我所知道的字符串。有控制台错误吗？animate将数字作为速度参数，而不是我所知道的字符串。

#wrapper {
    background-color: #FFFFFF;
    border: 3px solid #CCCCCC;
    border-radius: 7px 7px 7px 7px;
    box-shadow: 3px 3px 3px #CCCCCC;
    float: left;
    height: inherit;
    padding: 5px;
}

<div id="wrapper">
  <div id="explorer">
    <ul id="brochureTab">
      <li>...</li>
      <li>...</li>
      <li>...</li>
    </ul>
    <div id="ui-tabs-3">...</div>
    <div id="ui-tabs-10">...</div>
    <div id="ui-tabs-12">...</div>
  </div>
  <div id="statementTab">...</div>
</div>

#brochureTab {
  float: left;
  left: 10px;
  list-style: none outside none;
  margin: 0;
  padding: 0;
  position: relative;
  /* top: -45px; remove this line */
}

.ui-tabs-panel {
  background: none repeat scroll 0 0 #FFFFFF;
  border: 2px solid #CCCCCC;
  float: left;
  left: 30px;
  margin: 0 auto 30px;
  min-height: 410px;
  padding: 10px;
  position: relative;
  /* top: -20px; remove this line */
  width: 90%;
  z-index: 1;
}