Angular: Empty Fiddle
http://angularjs.org/
by Freewind
HTML
<script src="http://code.angularjs.org/angular-1.0.0rc8.js"></script>
<script src="http://code.jquery.com/jquery-1.7.2.min.js"></script>
<div ng-controller="MyCtrl">
<div ng-show="message" class="message" fadey="5000">{{message}}</div>
<button ng-click="newMessage()">Set Message</button>
</div>
CSS
.message {
background-color: green;
color: white;
font-size: white;
height: 60px;
line-height: 60px;
}
JavaScript
var myApp = angular.module('myApp',[]);
//myApp.directive('myDirective', function() {});
//myApp.factory('myService', function() {});
function MyCtrl($scope) {
$scope.newMessage = function() {
$scope.message = "Hello";
}
}
myApp.directive('fadey', function() {
return {
restrict: 'A',
link: function(scope, elm, attrs) {
jQuery(elm)
.css({ opacity: 1 })
.animate({ opacity: 0 }, parseInt(attrs.fadey));
}
};
});