Results 1 to 2 of 2

Thread: Move like in the link

  1. #1
    Join Date
    Aug 2013
    Posts
    10
    Thanks
    0
    Thanked 0 Times in 0 Posts

    Default Move like in the link

    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.

    Code:
    <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>

  2. #2
    Join Date
    Aug 2009
    Location
    utf-8
    Posts
    205
    Thanks
    4
    Thanked 7 Times in 7 Posts

    Default

    Quote Originally Posted by kadi View Post
    i am trying to move button like this in the link
    Move where? Are you trying to re create this or something similar?
    An inline div is a freak of the web and should be beaten until it becomes a span

Similar Threads

  1. Replies: 3
    Last Post: 10-22-2010, 05:04 PM
  2. Replies: 1
    Last Post: 05-25-2007, 03:39 PM
  3. how to move a picture
    By vikki in forum Graphics
    Replies: 6
    Last Post: 05-02-2006, 03:11 PM
  4. Move the mouse over a link and have the image of your choice
    By thebommer2005 in forum Dynamic Drive scripts help
    Replies: 1
    Last Post: 04-06-2006, 04:20 PM

Bookmarks

Posting Permissions

  • You may not post new threads
  • You may not post replies
  • You may not post attachments
  • You may not edit your posts
  •