Welcome to JS Bin
Load cached copy from
 
<!DOCTYPE html>
<html>
<head>
  <meta charset="utf-8">
  <title>JS Bin</title>
</head>
<body>
<div class="stage2">
  <div class="item2"></div>
  <div class="item2"></div>
</div>
</body>
</html>
 
.stage2{
    background:#fff;
    padding:20px;
    text-align: center;
    -webkit-filter:contrast(20);
  }
  .item2{
    display: inline-block;
    height:150px;
    width:150px;
    border-radius:50%;
    background:#000;
    -webkit-filter:blur(20px);
  }
  @-webkit-keyframes right {
    0%,100%{
      margin-left: -50px;
    }
    50%{
      margin-left: 50px;
    }
  }
  @-webkit-keyframes left{
    0%,100%{
      margin-left: 50px;
    }
    50%{
      margin-left: -50px;
    }
  }
  .item2:nth-child(1){
    -webkit-animation: right 5s infinite;
  }
  .item2:nth-child(2){
    -webkit-animation: left 5s infinite;
  }
Output

You can jump to the latest bin by adding /latest to your URL

Dismiss x