html - CSS(单击)动画将无法在Firefox中播放多次

我已经在Chrome和Safari中进行过尝试，每次按“打开”链接时动画都会运行，但是在Firefox中，动画仅在我第一次按链接时运行。之后，当我按下链接时，它不会加载动画。我每次按下链接时都可以做些什么使动画运行吗？

这是我正在使用的东西：

http://jsfiddle.net/p5hkyovs/4/

<div id="over">
    <div class="animation">Fade in - <a href="#start">Back</a></div>
</div>
<div id="start">
<a href="#over">Open</a>
</div>

的CSS

#over {
    display: none;
}
#over:target {
    display: inline-block
}
#over:target ~ #start {
    display: none;
}
div.animation {
    -webkit-animation:fadeIn .5s ease-in-out;
    -moz-animation:fadeIn .5s ease-in-out;
    animation:fadeIn .5s ease-in-out;
}
.fadeIn {
    -webkit-animation-name: fadeIn;
    animation-name: fadeIn;
}
@-webkit-keyframes fadeIn {
    0% {
        opacity: 0;
    }
    100% {
        opacity: 1;
    }
}
@keyframes fadeIn {
    0% {
        opacity: 0;
    }
    100% {
        opacity: 1;
    }
}

最佳答案

我认为问题是animation-name: fadeIn;值缺少mozilla供应商前缀。

试试这个JSFIDDLE

关于html - CSS(单击)动画将无法在Firefox中播放多次，我们在Stack Overflow上找到一个类似的问题：https://stackoverflow.com/questions/27293340/