当元素移出其容器时，jQuery animate 进入元素下方

【问题标题】：jQuery animate goes under element when element is moved out side its container当元素移出其容器时，jQuery animate 进入元素下方
【发布时间】：2009-09-25 07:44:00
【问题描述】：

我有一个元素位于容器内，位置相对，当我将此元素移出容器时，它会消失。但是我需要在它离开自己的容器后显示该元素。那么我怎样才能让该元素在它离开其容器的一侧后显示呢？

<div class="container">
    <div class="moving-element">
    </div>
</div>


$(element).animate({"top": "-100px"}, speed, easing, func);

【问题讨论】：

你能发布 2 个类的 CSS 吗？
.moving-element { 位置：相对；顶部：-400 像素；左：0px；向左飘浮;左边距：20px；宽度：100px；高度：100px；溢出：隐藏； } 并且容器没有样式

标签： jquery css jquery-animate

【解决方案1】：

您可以使用 CSS 设置该元素的 z-index。

z-index: 999;

将确保它几乎总是在顶部（除非某些其他元素具有更高的 z-index 并且重叠）。

编辑

其实可能是你的 CSS 或者其他冲突的元素，看看：

<style type="text/css">
.container {
height: 500px;
width: 500px;
background: red;
}

.moving-element {
position: relative;
height: 250px;
width: 250px;
background: blue;
}
</style>

<div class="container">
    <div class="moving-element">
    </div>
</div>

<script type="text/javascript" src="http://jqueryjs.googlecode.com/files/jquery-1.3.2.min.js"></script>
<script type="text/javascript">
$(function() {
    $('.moving-element').animate({"top": "-100px"}, 1000);
});
</script>

为我工作。

【讨论】：