Skip to content

Instantly share code, notes, and snippets.

@UncleBill
Created June 12, 2013 10:42
Show Gist options
  • Star 0 You must be signed in to star a gist
  • Fork 0 You must be signed in to fork a gist
  • Save UncleBill/5764320 to your computer and use it in GitHub Desktop.
Save UncleBill/5764320 to your computer and use it in GitHub Desktop.
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<title></title>
<style type="text/css" media="screen">
.box{
height:30px;
width:30px;
border-radius:30px;
opacity: .7; filter:alpha(opacity=70);
box-shadow:-7px -6px 13px 4px #00f inset;
position:absolute;
top:0px;
left:0px;
-webkit-animation:jump 2s infinite;
}
.box1{
-webkit-animation-delay: .1s;
}
.box{
-webkit-animation-delay: .2s;
}
.box3{
-webkit-animation-delay: .3s;
}
.box4{
-webkit-animation-delay: .4s;
}
.box5{
-webkit-animation-delay: .5s;
}
body{
position:relative;
}
@-webkit-keyframes jump
{
0%{
left: 0px;
}
50%{
left: 200px;
}
100%{
left: 0px;
}
}
</style>
</head>
<body>
<div class="box box1"></div>
<div class="box box2"></div>
<div class="box box3"></div>
<div class="box box4"></div>
<div class="box box5"></div>
</body>
</html>
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment