5

我就是不能让它工作。我很确定这一定是可能的。

这只是一个例子。我希望内部 div 以过渡效果向下移动。

<div id="outer">
    <div id="inner"></div>
</div>

<style type="text/css">       
    #outer
    {
        width:200px; 
        height:200px; 
        background-color:Yellow;
    }

    #inner
    {
        position:relative;
        -webkit-transition: top .4s ease-out;
        -moz-transition: top .4s ease-out;
        width:50px; 
        height: 100px; 
        background-color:Red;
    }

    #inner:hover
    {
        top:20px;
    }

</style>

它工作正常 f.ex。在 Chrome 中，但不是 Firefox 14 和 Opera 12（带有各自的 -o-transition）。我尝试了唯一的“过渡”属性但没有效果。

4

1 回答 1

10

你不能从 过渡auto到20px。将其显式设置为0pxin #inner {}。

于 2012-07-26T16:41:54.550 回答