Animations in Angularjs?

We can perform hiding and showing div with the help of animations in angularjs.



div {

  transition: all linear 0.5s;

  background-color: lightblue;

  height: 100px;

  width: 100%;

  position: relative;

  top: 0;

  left: 0;


.ng-hide {

  height: 0;

  width: 0;

  background-color: transparent;


  left: 200px;



<body ng-app=ā€¯AngMyApp”>

<h1>Hide the DIV: <input type=”checkbox” ng-model=”myCheck”></h1>

<div ng-hide=”myCheck”></div>


var app = angular.module(AngMyApp, [‘ngAnimate’]); </script>