kadi Posted May 9, 2014 Share Posted May 9, 2014 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 More sharing options...
Wolverine Posted May 9, 2014 Share Posted May 9, 2014 What Browser are you using? I ask because Internet Explorer 9 and below don't recognize all of your hard work. Link to comment Share on other sites More sharing options...
Recommended Posts
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 accountSign in
Already have an account? Sign in here.
Sign In Now