0
我在Chrome和Safari中試過它,每次按下Open鏈接時都會運行動畫,但在Firefox中,動畫只在第一次按鏈接時運行。之後,當我按鏈接它不加載動畫。每次按鏈接時是否有任何操作可以使動畫運行?CSS(點擊)動畫不會在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;
}
}