Untitled

<!DOCTYPE html>
<html ng-app="tradePlace">

  <head>
    <script data-require="angular.js@*" data-semver="1.3.0-beta.5" src="https://code.angularjs.org/1.3.0-beta.5/angular.js"></script>
    <script data-require="angular-route@1.2.17" data-semver="1.2.17" src="http://code.angularjs.org/1.2.17/angular-route.js"></script>
    <script data-require="angular-animate@*" data-semver="1.2.17" src="http://code.angularjs.org/1.2.17/angular-animate.js"></script>
    <link rel="stylesheet" href="style.css" />
    <script src="script.js"></script>
  </head>

  <body class="main" ng-view=""></body>

</html>

// Code goes here
var app = angular.module('tradePlace', ['ngRoute', 'ngAnimate']);

app.config(['$routeProvider', function($route) {
	$route.when('/', {
		redirectTo: '/index'
	}).
	when('/index', {
		template: 'page here lollloll <a ng-href="#/otherview">go to other view</a>'
	}).
	when('/otherview', {
	  template: 'page here lollloll <a ng-href="#/">go to prev view</a>'
	}).
	otherwise({
		redirectTo: '/index'
	});
	//$location.html5Mode(true);
}])

/* Styles go here */
.main {
    -webkit-transition: all 0.4s ease-in-out 0.5s;  
    -moz-transition: all 0.4s ease-in-out 0.5s;  
    -o-transition: all 0.4s ease-in-out 0.5s;  
    transition: all 0.4s ease-in-out 0.5s;   
}

.main.ng-enter, .main.ng-leave, .ng-hide {
    opacity: 0;
    height: 0px;
}
.ng-enter-active .ng-leave-active{
    opacity: 1;
}