在 IE7 中使用 jquery slideToggle 时内容消失

Posted 2023-02-25

【中文标题】在 IE7 中使用 jquery slideToggle 时内容消失

【英文标题】：content disappearing when using jquery slideToggle in IE7

【发布时间】：2010-07-27 21:31:47

【问题描述】：

我已经看到这个问题被问了好几次，但没有看到任何答案。

我有一个 ul，我正在使用带有 jquery 的 slideToggle() 来展开和折叠。 代码很简单：

$('#leftMenu li a.moreLess').click(function() 
    $(this).next().slideToggle('normal');   
);

标记为：

<a class="moreLess">Click here to see more</a>
<ul>
  <li>something</li>
  <li>something else</li>
  ...
</ul>

我有一个带有 .moreLess 类的按钮，当单击它时，它下面的列表应该展开或折叠。由于某种原因，在 IE 7 中，一旦列表完全扩展，所有内容都会消失。当它折叠时，内容会再次出现，直到列表完全关闭。

我不确定这是否与 CSS 相关，但我希望以前有人可能遇到过这种情况。 提前感谢您的帮助！

【问题讨论】：

jQuery slideDown in IE9 - content disappears after animation finishes 的可能重复项

【参考方案1】：

放置一个 zoom:1 属性。它适用于位置：相对。

【讨论】：

为我工作！有时 IE 如此糟糕实际上是一件好事，因为那里有大量关于如何解决它的文档。比脾气暴躁好得多

【参考方案2】：

仅供参考，问题在于正在切换的 UL 内的元素上的 CSS 定位。一旦我删除了这些元素上的任何相对和/或绝对定位，问题就不再发生了。

【讨论】：

非常感谢您回来回答您自己的问题，遇到了完全相同的问题，这为我解决了问题。

当你有 postition:relative|absolute 被切换的东西（不仅仅是内容）时，这似乎也是一个问题。就我而言，它是一个 div。 Phenom 的修复（设置 zoom:1 属性）解决了我的问题。

【参考方案3】：

放 overflow: hidden; 对于您拥有内容的 div，这会变得一团糟。对我有用，但它仍然是和 IE 错误...

【参考方案4】：

在我的情况下，使用 slideToggle 加载的内容被“向下移动”创建 2 个空白空间（仅在 IE7 中）

我用这个 css 解决了：

form 
    margin: 0;