css - CSS滑动div(转换/转换在Firefox 25.0.1中不起作用)

当您将鼠标悬停在div上时，我尝试创建一个从右侧进入的滑动div。它可以在Chrome中使用，但不能在Firefox中使用...我想念什么？它可以在Chrome和Safari中正常工作...

http://jsfiddle.net/mwilday/MVw57/1/

CSS：

    .gettingstarted {
    -ms-transform: translate(200px, 0px);
    /* IE 9 */
    -webkit-transform: translate(200px, 0px);
    /* Safari and Chrome */
    -moz-transform: translate(200px, 0px);
    transform: translate(200px, 0px);
    background: rgba(0, 0, 0, .8);
}
.gettingstarted:hover {
    -webkit-transition: .8s;
    -moz-transition: .8s;
    transition: .8s;
    transition-timing-function: ease-in-out;
    -ms-transform: translate(0px, 0px);
    /* IE 9 */
    -webkit-transform: translate(0px, 0px);
    /* Safari and Chrome */
    -moz-transform: translate(0px, 0px);
    transform: translate(0px, 0px);

HTML：

<div id="frontpagetile">
    <div class="gettingstarted">
        <p style="text-align: left;">Getting Started</p>
        <ul>
            <li style="text-align: left;"><a href="http://www.google.com">Link</a>
            </li>
            <li style="text-align: left;"><a href="http://www.google.com"><span style="line-height:         1.231;">Link</span></a>
            </li>
            <li style="text-align: left;"><a href="http://www.google.com"><span style="line-height: 1.231;">Link</span></a>
            </li>
        </ul>
    </div>
</div>

最佳答案

您的小提琴在.gettingstarted元素上使用了：hover选择器，该选择器不可见。将选择器.gettingstarted:hover {}更改为#frontpagetile:hover .gettingstarted {}，以便在悬停父元素时进行悬停更改。