Animation on ViewPort

by Dhruvang Gajjar

HTML

<div class=""></div>

CSS

div {
  background-color: red;
  height: 2px;
  width: 100px;
}

div.drawline {
  -webkit-animation-name: example;
  -webkit-animation-duration: 4s;
  animation-name: example;
  animation-duration: 4s;
}


/* Safari 4.0 - 8.0 */

@-webkit-keyframes example {
  from {
    width: 0;
  }
  to {
    width: 100px;
  }
}


/* Standard syntax */

@keyframes example {
  from {
    width: 0;
  }
  to {
    width: 100px;
  }
}

</style>

JavaScript

$("div").addClass("drawline");