Jump to content

Move like in the link


kadi

Recommended Posts

i am trying to move button like this in the link http://www.gamesforthebrain.com/game/twincol/ but i cant move it. here is what i have done.
<div id="box" style='width:200px;height:200px;border:1px solid black;'/>     <button id="one" type="button" >Button1</button>    <button id="two" type="button" >Button2</button><button id="three" type="button">Button3</button> <style> button{-webkit-appearance:none;width:40px;height:40px;padding: 0;text-align: center;vertical-align: middle;border: 1px solid red;font-size:10px;font-weight:bold;} #one, #two, #three{position:relative; }#one{-webkit-animation:levelseven 16s  infinite;    -webkit-animation-direction:alternate;    } #two{ animation-direction:alternate; /* Safari and Chrome */-webkit-animation:levelseven_1 8s  infinite; } #three{ animation-direction:alternate; /* Safari and Chrome */-webkit-animation:levelseven_2 10s  infinite; }  @-webkit-keyframes levelseven /* Safari and Chrome */{0%   { left:0px; top:0px;}25%  { left:200px; top:0px;}50%  { left:100px; top:200px;}75%  { left:150px; top:50px;}100% {background:cyan; left:0px; top:0px;}} @-webkit-keyframes levelseven_1 /* Safari and Chrome */{0%   { left:0px; top:0px;}50%  {background:darkgoldenrod; left:0px; top:200px;}100% { left:0px; top:0px;}  }  @-webkit-keyframes levelseven_2 /* Safari and Chrome */{0%   { left:0px; top:0px;}50%  {left:200px; top:0px;}100% {left:0px; top:0px;}} </style>
Link to comment
Share on other sites

Create an account or sign in to comment

You need to be a member in order to leave a comment

Create an account

Sign up for a new account in our community. It's easy!

Register a new account

Sign in

Already have an account? Sign in here.

Sign In Now
×
×
  • Create New...