Difference between revisions of "User:Alec2435/style.css"

From RealCTY
Jump to navigation Jump to search
(Created page with "#animated_div { width:20%; animation:animated_div 5s 1; position:relative; border-radius:5px; -webkit-border-radius:5px; animation-iteration-count: infinite; } @keyframes ani...")
 
(No difference)

Latest revision as of 21:41, 22 May 2016

#animated_div
{
width:20%;
animation:animated_div 5s 1;
position:relative;
border-radius:5px;
-webkit-border-radius:5px;
animation-iteration-count: infinite;
}

@keyframes animated_div
{
0%		{transform: rotate(0deg);left:0%;}
25%		{transform: rotate(20deg);left:5%;}
50%		{transform: rotate(0deg);left:90%;}
55%		{transform: rotate(0deg);left:90%;}
70%		{transform: rotate(0deg);left:90%;}
100%	{transform: rotate(-360deg);left:0%;}
}

<!--@-webkit-keyframes animated_div
{
0%		{-webkit-transform: rotate(0deg);left:0px;}
25%		{-webkit-transform: rotate(20deg);left:0px;}
50%		{-webkit-transform: rotate(0deg);left:500px;}
55%		{-webkit-transform: rotate(0deg);left:500px;}
70%		{-webkit-transform: rotate(0deg);left:500px;}
100%	{-webkit-transform: rotate(-360deg);left:0px;}
}

@-moz-keyframes animated_div
{
0%   {-moz-transform: rotate(0deg);left:0px;}
25%  {-moz-transform: rotate(20deg);left:0px;}
50%  {-moz-transform: rotate(0deg);left:500px;}
55%  {-moz-transform: rotate(0deg);left:500px;}
70%  {-moz-transform: rotate(0deg);left:500px;}
100% {-moz-transform: rotate(-360deg);left:0px;}
}

@-o-keyframes animated_div
{
0%   {transform: rotate(0deg);left:0px;}
25%  {transform: rotate(20deg);left:0px;}
50%  {transform: rotate(0deg);left:500px;}
55%  {transform: rotate(0deg);left:500px;}
70%  {transform: rotate(0deg);left:500px;}
100% {transform: rotate(-360deg);left:0px;}
}-->