使用 jquery SlideDown 在 ipad 上动画完成后 div 标签消失

Question

我正在使用 $('div#MainNavigation').slideDown('medium'); 向下滑动 div 标签。 iPad 上的动画完成后，它就会消失。

我使用的网站是 www.missbossyboots.com.au 单击左上角的徽标可激活滑动代码。

Answer 1

对我来说，与 Gavin Bruce 相反，正是因为填充底部，我的 div 消失了！

为了解决这个问题，我只需将 css“overflow:hidden;” 添加到lideUp/slideDown 元素（在我的例子中是一个div）。

Answer 2

我知道我参加聚会迟到了，但我在遇到这个问题时发现了这个问题，加文的评论没有解决我的问题（给定的设计看起来也不会正确）。

当我把头撞在墙上时，因为这在除 IOS Safari 之外的每个浏览器中都能正常工作，我终于发现了我的情况的罪魁祸首：

一个放错位置的 z-index标签。

这是我的代码的“轻型”版本：

<div class="children"> <!-- this is the container, which is the target of a jQuery slideDown() -->
    <ul> <!-- this element would "pop" outside of the container after animation completed -->
        <li><a href="#">Menu Item 1</a><li>
        <li><a href="#">Menu Item 2</a><li>
        <li><a href="#">Menu Item 3</a><li>
    </ul>
</div>

最初，我将 z-index: 3000; 应用于

元素。

当我将其从 ul 中删除并将其移动到

元素后，我的问题就消失了，并且 ul 在动画结束后留在了它所属的位置。

Answer 3

我遇到了相同（或类似）的问题 - 在 jquerylideDown() 转换后内容“跳出”其容器。对我来说，它与 z-index 无关。我通过删除样式“position:relative;”解决了这个问题（使其成为“静态”）用于跳跃的元素。我仍然不清楚为什么会发生这种情况，并且删除position:rel并不总是一个选择。我使用的是 jquery 1.9.1，我不确定这是否是 jquery 中的错误。