CSS3动画师自动_JavaScript_PHP_下载.zip

.mod_canvas{width:1600px;height:210px;background-color:#701b70;background-image:url(../../project/0//header_bg_top.jpg)} .mod_canvas .layer_0{ position:absolute;left:-28px;top:8px;background-size:100% 100%;background-image:url(../../project/0/coin_69x70.png); -webkit-animation: frame_layer_0 1s infinite Ease-in alternate; -moz-animation: frame_layer_0 1s infinite Ease-in alternate; } @-webkit-keyframes frame_layer_0 { 0% {opacity:1;width:69px;height:70px;} 25% {opacity:0.5;width:69px;height:70px;} 50% {opacity:1;width:69px;height:70px;} 75% {opacity:0.5;width:69px;height:70px;} 100% {opacity:1;width:69px;height:70px;} } @-moz-keyframes frame_layer_0 { 0% {opacity:1;width:69px;height:70px;} 25% {opacity:0.5;width:69px;height:70px;} 50% {opacity:1;width:69px;height:70px;} 75% {opacity:0.5;width:69px;height:70px;} 100% {opacity:1;width:69px;height:70px;} } .mod_canvas .layer_1{ position:absolute;left:76px;top:192px;background-size:100% 100%;background-image:url(../../project/0/coin_40x42.png); -webkit-animation: frame_layer_1 20.22s infinite Ease-in-out normal; -moz-animation: frame_layer_1 20.22s infinite Ease-in-out normal; } @-webkit-keyframes frame_layer_1 { 0% {width:40px;height:42px;-webkit-transform:translate(0px,0px) scale(1,1) skew(0deg) rotate(0deg);} 0.9891196834817% {width:40px;height:42px;-webkit-transform:translate(0px,0px) scale(1,1) skew(0deg) rotate(0deg);} 1.9782393669634% {width:40px;height:42px;-webkit-transform:translate(0px,-30px) scale(1,1) skew(0deg) rotate(0deg);} 2.4727992087043% {width:40px;height:42px;-webkit-transform:translate(0px,0px) scale(1,1) skew(0deg) rotate(0deg);} 2.9673590504451% {width:40px;height:42px;-webkit-transform:translate(0px,-15px) scale(1,1) skew(0deg) rotate(0deg);} 3.9564787339268% {width:40px;height:42px;-webkit-transform:translate(0px,0px) scale(1,1) skew(0deg) rotate(0deg);} 100% {width:40px;height:42px;-webkit-transform:translate(0px,0px) scale(1,1) skew(0deg) rotate(0deg);} } @-moz-keyframes frame_layer_1 { 0% {width:40px;height:42px;-moz-transform:translate(0px,0px) scale(1,1) skew(0deg) rotate(0deg);} 0.9891196834817% {width:40px;height:42px;-moz-transform:translate(0px,0px) scale(1,1) skew(0deg) rotate(0deg);} 1.9782393669634% {width:40px;height:42px;-moz-transform:translate(0px,-30px) scale(1,1) skew(0deg) rotate(0deg);} 2.4727992087043% {width:40px;height:42px;-moz-transform:translate(0px,0px) scale(1,1) skew(0deg) rotate(0deg);} 2.9673590504451% {width:40px;height:42px;-moz-transform:translate(0px,-15px) scale(1,1) skew(0deg) rotate(0deg);} 3.9564787339268% {width:40px;height:42px;-moz-transform:translate(0px,0px) scale(1,1) skew(0deg) rotate(0deg);} 100% {width:40px;height:42px;-moz-transform:translate(0px,0px) scale(1,1) skew(0deg) rotate(0deg);} } .mod_canvas .layer_2{ position:absolute;left:-124px;top:46px;background-size:100% 100%;background-image:url(../../project/0/coin_40x42.png); -webkit-animation: frame_layer_2 1s infinite Linear normal; -moz-animation: frame_layer_2 1s infinite Linear normal; } @-webkit-keyframes frame_layer_2 { 0% {width:40px;height:42px;} 50% {width:40px;height:42px;-webkit-transform:translate(0px,0px) scale(1.1,1.1) skew(0deg) rotate(0deg);} 100% {width:40px;height:42px;} } @-moz-keyframes frame_layer_2 { 0% {width:40px;height:42px;} 50% {width:40px;height:42px;-moz-transform:translate(0px,0px) scale(1.1,1.1) skew(0deg) rotate(0deg);} 100% {width:40px;height:42px;} } .mod_canvas .layer_3{ position:absolute;left:359px;top:114px;background-size:100% 100%;background-image:url(../../project/0/coin_40x42.png); -webkit-animation: frame_layer_3 1s infinite; -moz-animation: frame_layer_3 1s infinite; } @-webkit-keyframes frame_layer_3 { 0% {width:40px;height:42px;-webkit-transform:translate(0px,0px) scale(1,1) skew(0deg) rotate(0deg);} 20% {width:40px;height:42px;-webkit-transform:translate(0px,0px) scale(1,1) skew(0deg) rotate(0deg);} 40% {width:40px;height:42px;-webkit-transform:translate(0px,-30px) scale(1,1) skew(0deg) rotate(0deg);} 50% {width:40px;height:42px;-webkit-transform:translate(0px,0px) scale(1,1) skew(0deg) rotate(0deg);} 60% {width:40px;height:42px;-webkit-transform:translate(0px,-15px) scale(1,1) skew(0deg) rotate(0deg);} 80% {width:40px;height:42px;-webkit-transform:translate(0px,0px) scale(1,1) skew(0deg) rotate(0deg);} 100% {width:40px;height:42px;-webkit-transform:translate(0px,0px) scale(1,1) skew(0deg) rotate(0deg);} } @-moz-keyframes frame_layer_3 { 0% {width:40px;height:42px;-moz-transform:translate(0px,0px) scale(1,1) skew(0deg) rotate(0deg);} 20% {width:40px;height:42px;-moz-transform:translate(0px,0px) scale(1,1) skew(0deg) rotate(0deg);} 40% {width:40px;height:42px;-moz-transform:translate(0px,-30px) scale(1,1) skew(0deg) rotate(0deg);} 50% {width:40px;height:42px;-moz-transform:translate(0px,0px) scale(1,1) skew(0deg) rotate(0deg);} 60% {width:40px;height:42px;-moz-transform:translate(0px,-15px) scale(1,1) skew(0deg) rotate(0deg);} 80% {width:40px;height:42px;-moz-transform:translate(0px,0px) scale(1,1) skew(0deg) rotate(0deg);} 100% {width:40px;height:42px;-moz-transform:translate(0px,0px) scale(1,1) skew(0deg) rotate(0deg);} } .mod_canvas .layer_4{ position:absolute;left:581px;top:136px;background-size:100% 100%;background-image:url(../../project/0/coin_53x67.png); -webkit-animation: frame_layer_4 1s infinite; -moz-animation: frame_layer_4 1s infinite; } @-webkit-keyframes frame_layer_4 { 0% {width:53px;height:67px;} 10% {width:53px;height:67px;-webkit-transform:translate(0px,0px) scale(0.9,1) skew(0deg) rotate(-3deg);} 20% {width:53px;height:67px;-webkit-transform:translate(0px,0px) scale(0.9,1) skew(0deg) rotate(-3deg);} 30% {width:53px;height:67px;-webkit-transform:translate(0px,0px) scale(1.1,1) skew(0deg) rotate(3deg);} 40% {width:53px;height:67px;-webkit-transform:translate(0px,0px) scale(1.1,1) skew(0deg) rotate(-3deg);} 50% {width:53px;height:67px;-webkit-transform:translate(0px,0px) scale(1.1,1) skew(0deg) rotate(3deg);} 60% {width:53px;height:67px;-webkit-transform:translate(0px,0px) scale(1.1,1) skew(0deg) rotate(-3deg);} 70% {width:53px;height:67px;-webkit-transform:translate(0px,0px) scale(1.1,1) skew(0deg) rotate(3deg);} 80% {width:53px;height:67px;-webkit-transform:translate(0px,0px) scale(1.1,1) skew(0deg) rotate(-3deg);} 90% {width:53px;height:67px;-webkit-transform:translate(0px,0px) scale(1.1,1) skew(0deg) rotate(3deg);} 100% {width:53px;height:67px;} } @-moz-keyframes frame_layer_4 { 0% {width:53px;height:67px;} 10% {width:53px;height:67px;-moz-transform:translate(0px,0px) scale(0.9,1) skew(0deg) rotate(-3deg);} 20% {width:53px;height:67px;-moz-transform:translate(0px,0px) scale(0.9,1) skew(0deg) rotate(-3deg);} 30% {width:53px;height:67px;-moz-transform:translate(0px,0px) scale(1.1,1) skew(0deg) rotate(3deg);} 40% {width:53px;height:67px;-moz-transform:translate(0px,0px) scale(1.1,1) skew(0deg) rotate(-3deg);} 50% {width:53px;height:67px;-moz-transform:translate(0px,0px) scale(1.1,1) skew(0deg) rotate(3deg);} 60% {width:53px;height:67px;-moz-transform:translate(0px,0px) scale(1.1,1) skew(0deg) rotate(-3deg);} 70% {width:53px;height:67px;-moz-transform:translate(0px,0px) scale(1.1,1) skew(0deg) rotate(3deg);} 80% {width:53px;height:67px;-moz-transform:translate(0px,0px) scale(1.1,1) skew(0deg) rotate(-3deg);} 90% {width:53px;height:67px;-moz-transform:translate(0px,0px) scale(1.1,1) skew(0deg) rotate(3deg);} 100% {width:53px;height:67px;} } .mod_canvas .layer_5{ position:absolute;left:720px;top:52px;background-size:100% 100%;background-image:url(../../project/0/coin_69x70.png); -webkit-animation: frame_layer_5 1s infinite; -moz-animation: frame_layer_5 1s infinite; } @-webkit-keyframes frame_layer_5 { 0% {width:69px;height:70px;} 20% {width:69px;height:70px;-webkit-transform:translate(0px,0px) scale(1,1) skew(0deg) rotate(15deg);-webkit-transform-origin:50% 0%;} 40% {width:69px;height:70px;-webkit-transform:translate(0px,0px