@charset "utf-8"; /* 高端定制服务动画效果 */ /*从上往下*/ @-webkit-keyframes a1{ 0%{opacity: 0;transform:translate(0px,-1000px)} 60%{opacity: 1;transform:translate(0px,0px)} } @-moz-keyframes a1{ 0%{opacity: 0;transform:translate(0px,-1000px)} 60%{opacity: 1;transform:translate(0px,0px)} } @-o-keyframes a1{ 0%{opacity: 0;transform:translate(0px,-1000px)} 60%{opacity: 1;transform:translate(0px,0px)} } @keyframes a1{ 0%{opacity: 0;transform:translate(0px,-1000px)} 60%{opacity: 1;transform:translate(0px,0px)} } /*从右往左*/ @-webkit-keyframes a2{ 0%{opacity: 0;transform:translate(1000px,0px)} 60%{opacity: 1;transform:translate(0,0)} } @-moz-keyframes a2{ 0%{opacity: 0;transform:translate(1000px,0px)} 60%{opacity: 1;transform:translate(0,0)} } @-o-keyframes a2{ 0%{opacity: 0;transform:translate(1000px,0px)} 60%{opacity: 1;transform:translate(0,0)} } @keyframes a2{ 0%{opacity: 0;transform:translate(1000px,0px)} 60%{opacity: 1;transform:translate(0,0)} } /*从左往右*/ @-webkit-keyframes a3{ 0%{opacity: 0;transform:translate(-1000px,0px)} 60%{opacity: 1;transform:translate(0,0)} } @-moz-keyframes a3{ 0%{opacity: 0;transform:translate(-1000px,0px)} 60%{opacity: 1;transform:translate(0,0)} } @-o-keyframes a3{ 0%{opacity: 0;transform:translate(-1000px,0px)} 60%{opacity: 1;transform:translate(0,0)} } @keyframes a3{ 0%{opacity: 0;transform:translate(-1000px,0px)} 60%{opacity: 1;transform:translate(0,0)} } /*从下往上*/ @-webkit-keyframes a4{ 0%{opacity: 0;transform:translate(0px,1000px)} 60%{opacity: 1;transform:translate(0,0)} } @-moz-keyframes a4{ 0%{opacity: 0;transform:translate(0px,1000px)} 60%{opacity: 1;transform:translate(0,0)} } @-o-keyframes a4{ 0%{opacity: 0;transform:translate(0px,1000px)} 60%{opacity: 1;transform:translate(0,0)} } @keyframes a4{ 0%{opacity: 0;transform:translate(0px,1000px)} 60%{opacity: 1;transform:translate(0,0)} } /*从左往右*/ @-webkit-keyframes a5{ 0%{opacity: 0;transform:translate(-1000px,0px)} 60%{opacity: 1;transform:translate(0,0)} } @-moz-keyframes a5{ 0%{opacity: 0;transform:translate(-1000px,0px)} 60%{opacity: 1;transform:translate(0,0)} } @-o-keyframes a5{ 0%{opacity: 0;transform:translate(-1000px,0px)} 60%{opacity: 1;transform:translate(0,0)} } @keyframes a5{ 0%{opacity: 0;transform:translate(-1000px,0px)} 60%{opacity: 1;transform:translate(0,0)} } /*放大*/ @-webkit-keyframes a6{ 0%{opacity: 0;-webkit-transform:scale(0.5);-moz-transform:scale(0.5);-o-transform:scale(0.5);transform:scale(0.5);} 60%{opacity: 1;-webkit-transform:scale(1.2);-moz-transform:scale(1.2);-o-transform:scale(1.2);transform:scale(1.2);} 100%{opacity: 1;-webkit-transform:scale(1);-moz-transform:scale(1);-o-transform:scale(1);transform:scale(1);} } @-moz-keyframes a6{ 0%{opacity: 0;-webkit-transform:scale(0.5);-moz-transform:scale(0.5);-o-transform:scale(0.5);transform:scale(0.5);} 60%{opacity: 1;-webkit-transform:scale(1.2);-moz-transform:scale(1.2);-o-transform:scale(1.2);transform:scale(1.2);} 100%{opacity: 1;-webkit-transform:scale(1);-moz-transform:scale(1);-o-transform:scale(1);transform:scale(1);} } @-o-keyframes a6{ 0%{opacity: 0;-webkit-transform:scale(0.5);-moz-transform:scale(0.5);-o-transform:scale(0.5);transform:scale(0.5);} 60%{opacity: 1;-webkit-transform:scale(1.2);-moz-transform:scale(1.2);-o-transform:scale(1.2);transform:scale(1.2);} 100%{opacity: 1;-webkit-transform:scale(1);-moz-transform:scale(1);-o-transform:scale(1);transform:scale(1);} } @keyframes a6{ 0%{opacity: 0;-webkit-transform:scale(0.5);-moz-transform:scale(0.5);-o-transform:scale(0.5);transform:scale(0.5);} 60%{opacity: 1;-webkit-transform:scale(1.2);-moz-transform:scale(1.2);-o-transform:scale(1.2);transform:scale(1.2);} 100%{opacity: 1;-webkit-transform:scale(1);-moz-transform:scale(1);-o-transform:scale(1);transform:scale(1);} } /*左右*/ @-webkit-keyframes a7{ 0%{opacity: 0;transform:translate(-1000px,0px)} 25%{opacity: 1;transform:translate(0px,0px)} 50%{opacity: 1;transform:translate(-50px,0px)} 100%{opacity: 1;transform:translate(0px,0px)} } @-moz-keyframes a7{ 0%{opacity: 0;transform:translate(-1000px,0px)} 25%{opacity: 1;transform:translate(0px,0px)} 50%{opacity: 1;transform:translate(-50px,0px)} 100%{opacity: 1;transform:translate(0px,0px)} } @-o-keyframes a7{ 0%{opacity: 0;transform:translate(-1000px,0px)} 25%{opacity: 1;transform:translate(0px,0px)} 50%{opacity: 1;transform:translate(-50px,0px)} 100%{opacity: 1;transform:translate(0px,0px)} } @keyframes a7{ 0%{opacity: 0;transform:translate(-1000px,0px)} 25%{opacity: 1;transform:translate(0px,0px)} 50%{opacity: 1;transform:translate(-50px,0px)} 100%{opacity: 1;transform:translate(0px,0px)} } /*360度旋转*/ @-webkit-keyframes a8{ from{-webkit-transform:rotate(0deg)} to{-webkit-transform:rotate(360deg)} } @-moz-keyframes a8{ from{-webkit-transform:rotate(0deg)} to{-webkit-transform:rotate(360deg)} } @-ms-keyframes a8{ from{-webkit-transform:rotate(0deg)} to{-webkit-transform:rotate(360deg)} } @keyframes a8{ from{-webkit-transform:rotate(0deg)} to{-webkit-transform:rotate(360deg)} } /**/ @-webkit-keyframes a9{ 0%{-webkit-transform-origin: left bottom;-webkit-transform: rotate(90deg);opacity: 0;} 100%{-webkit-transform-origin: left bottom;-webkit-transform: rotate(0);opacity: 1;} } @-moz-keyframes a9{ 0%{-webkit-transform-origin: left bottom;-webkit-transform: rotate(90deg);opacity: 0;} 100%{-webkit-transform-origin: left bottom;-webkit-transform: rotate(0);opacity: 1;} } @-o-keyframes a9{ 0%{-webkit-transform-origin: left bottom;-webkit-transform: rotate(90deg);opacity: 0;} 100%{-webkit-transform-origin: left bottom;-webkit-transform: rotate(0);opacity: 1;} } @keyframes a9{ 0%{-webkit-transform-origin: left bottom;-webkit-transform: rotate(90deg);opacity: 0;} 100%{-webkit-transform-origin: left bottom;-webkit-transform: rotate(0);opacity: 1;} } /*显示*/ @-webkit-keyframes a10{ 0%{opacity: 0;} 100%{opacity: 1;} }