我的动画在firefox 47中不起作用?

时间:2016-07-14 16:57:48

标签: css css-animations vendor vendor-prefix prefixes

抱歉,如果这是一个愚蠢的问题。我试图让我的网站在不同的浏览器上工作,动画不会出现在Firefox中。这就是完整的css http://frambach.cc/css/main.css,这是一段代码片段:

    /* ---------- Effects ---------- */




    /*
    ==============================================
    div - fadeIn
    ==============================================
    */

    .fadeIn {
	  -webkit-animation-name: fadeIn;	
          animation-name: fadeIn;
	
	  -webkit-animation-duration: 1.2s;
	  animation-duration: 1.2s;
	
	  -webkit-animation-timing-function: ease-in-out;	
	  animation-timing-function: ease-in-out;	

	  visibility: visible !important;	
    }


    @-webkit-keyframes fadeIn {

	    0% {
		  -webkit-transform: scale(0);
		  opacity: 0.0;		
	    }
	    60% {
		  -webkit-transform: scale(1.1);
	    }

	    80% {
		  -webkit-transform: scale(0.9);
		  opacity: 1;	
	    }	
	    100% {
		  -webkit-transform: scale(1);
		  opacity: 1;	
	    }		
    }


    @keyframes fadeIn {
	    0% {
		   -webkit-transform: scale(0);
		    transform: scale(0);
		    opacity: 0.0;		
	    }
	    60% {
		   -webkit-transform: scale(1.1);
		    transform: scale(1.1);	
	    }
	    80% {
		   -webkit-transform: scale(0.9);
		    transform: scale(0.9);
		    opacity: 1;	
	    }	
	    100% {
		   -webkit-transform: scale(1);
		    transform: scale(1);
		    opacity: 1;	
	    }		
    }
<div class="fadeIn">Test Me!</div>

我在这里做错了什么? 提前谢谢

0 个答案:

没有答案