0
我創建了一個從角落開始的脈動動畫。我希望它從圓心開始,下面是相同的CSS,我應該如何從圓心開始動畫。從中心開始脈衝
.animation-container{width: auto; height: 500px;}
.aniCircle{width: 100px;height: 100px;border-radius: 50%;background: orange;margin: 0 auto;position: relative;top: 40%;animation: firstone 2s linear infinite alternate;-webkit-animation: firstone 2s linear infinite alternate;}
@-webkit-keyframes firstone{
0% {width:0px; height: 0px; background: violet;}
10%{width: 10px; height: 10px;background: indigo;}
20%{width: 20px; height: 20px; background: blue;}
30%{width: 30px; height: 30px; background: green;}
40%{width: 40px; height: 40px; background: yellow;}
50%{width: 50px; height: 50px; background: orange;}
60%{width: 60px; height: 60px; background: orange;}
70%{width: 70px; height: 70px; background: red;}
80%{width: 80px; height: 80px; background: orange;}
90%{width: 90px; height: 90px; background: yellow;}
100%{width: 100px; height: 100px; background: green;}
}
這裏是鏈接到codepen:http://codepen.io/SurajVerma/pen/igxyr
感謝。
謝謝你,它的工作。 :) – 3ncrypter 2014-11-05 05:01:58
現在我意識到我可以動畫轉換屬性而不是高度和寬度從中心開始脈衝。這裏是[鏈接](http://codepen.io/SurajVerma/pen/igxyr) – 3ncrypter 2014-11-05 06:01:55