Question

这里的简单示例： http://jsfiddle.net/CnUkA/5/

我有一个应用了slideDown动画的外部div，而在这个div中是一个带有position:relative的内部div。

单击按钮IE7时，内部div会立即显示。在我正在使用它的现实世界中，我需要div相对于我可以用绝对的方式将孩子放在其中。

---编辑---

在position:absolute上使用#slide并不适合我的情况。

我的元素相对于#inner div绝对定位，因此我无法从中移除position:relative。

以下是一个更新的示例，说明我position:relative上需要#inner的原因。 http://jsfiddle.net/CnUkA/9/

在幻灯片动画在IE7中完成之前，相对元素和绝对元素都会显示

---编辑2 ---

结合以下答案，我认为这是一个不错的解决方案：

http://jsfiddle.net/CnUkA/13/

将position:relative添加到正在向下滑动的div，然后在动画完成后设置position:static。这可以防止元素消失。

Answer 1

似乎孩子立即显示，因为偏移父母不是#slide div。

如果您在position: relative; div上设置#slide，效果会更好，但由于某种原因，最后三行会在幻灯片后消失。

如果您在position: absolute; div上设置#slide，则可以正常使用。

Answer 2

简单的方法，我在IE浏览器中进行测试

Remove-  #inner position:relative property And Update your jQuery script also

<script type="text/javascript">
$(document).ready(function(){

    $("button").click(function(){

         $("#slide").slideDown(2000, function()
         { 
         $("#inner").css("position","relative");
         });

    });

});
</script>

Answer 3

只需将位置绝对添加到

#slide{
   display:none;
   position:absolute;
}

jQuery slideDown，当孩子有位置时的IE7 bug：相对

3 个答案: