-moz-transition-duration 不起作用？答案

【问题标题】：-moz-transition-duration not working?-moz-transition-duration 不起作用？
【发布时间】：2023-03-22 04:13:01
【问题描述】：

下面是我用来尝试实现 3D 动画的代码：

这是小提琴和代码： http://jsfiddle.net/82C2N/

<html>
<head>
    <title>3D CSS Animation</title>
    <style>
        #movieposters li { 
            display:inline; float:left;
            -webkit-perspective: 500; 
            -webkit-transform-style: preserve-3d;
            -webkit-transition-property: perspective; 
            -webkit-transition-duration: 0.5s; 
            transition-duration: 1s; 
            -moz-perspective: 500; 
            -moz-transform-style: preserve-3d;
            -moz-transition-property: perspective; 

        width: 200px;
        }

        #movieposters li:hover { 
            -webkit-perspective: 5000; 
            -moz-perspective: 5000; 
            transition-duration: 1s; 
            transition-timing-function: linear; 
        width: 200px;
        }

        #movieposters li img { 
            -webkit-transform: rotateY(30deg);
            -webkit-transition-property: transform; 
            transition-duration: 0.5s; 
            -moz-transition-duration: 1s; 
            -moz-transform: rotateY(30deg);
            -moz-transition-property: transform; 

        width: 200px;
        }
        #movieposters li:hover img { 
        width: 200px;
            -webkit-transform: rotateY(0deg); 
            -moz-transform: rotateY(0deg);
        }
    </style>
</head>
<body style="height: 100%" class="bluegradient">
    <ul id="movieposters">
        <li>
            <img src="http://fc02.deviantart.net/fs36/i/2008/252/6/1/House_MD_DVD_covers_by_kdaver.jpg"/>
        </li>
    </ul>
</body>

要查看所需的效果，请在 Chrome 中打开该效果。在 Firefox 中，-moz-transition-duration 似乎没有效果。悬停时透视和旋转值会发生变化，但没有任何动画。

知道为什么吗？我使用的是最新版本的 Firefox (10.0.2)。

【问题讨论】：

标签： firefox css css-transitions

【解决方案1】：

transform 的值有问题，在 Mozilla 中以 -moz-transform 为前缀。

#movieposters li img {
    -moz-transition-property: -moz-transform  
}

这里是小提琴：
http://jsfiddle.net/cadence96/82C2N/1/

【讨论】：