diff --git a/docs/content/tutorial/step_12.ngdoc b/docs/content/tutorial/step_12.ngdoc index ba281c01e0ed..b611e0725557 100644 --- a/docs/content/tutorial/step_12.ngdoc +++ b/docs/content/tutorial/step_12.ngdoc @@ -340,45 +340,58 @@ Although we could do that, let's take the opportunity to learn how to create Jav __`app/js/animations.js`.__
-angular.module('phonecatAnimations', ['ngAnimate']) - - .animation('.phone', function() { - return { - addClass : function(element, className, done) { - if(className != 'active') { - return; - } - element.css({ - position: 'absolute', - top: 500, - left: 0, - display: 'block' - }); - jQuery(element).animate({ - top: 0 - }, done); - - return function(cancel) { - if(cancel) element.stop(); - }; - }, - removeClass : function(element, className, done) { - if(className != 'active') return; - element.css({ - position: 'absolute', - left: 0, - top: 0 - }); - jQuery(element).animate({ - top: -500 - }, done); - - return function(cancel) { - if(cancel) element.stop(); - }; +var phonecatAnimations = angular.module('phonecatAnimations', ['ngAnimate']); + +phonecatAnimations.animation('.phone', function() { + + var animateUp = function(element, className, done) { + if(className != 'active') { + return; + } + element.css({ + position: 'absolute', + top: 500, + left: 0, + display: 'block' + }); + + jQuery(element).animate({ + top: 0 + }, done); + + return function(cancel) { + if(cancel) { + element.stop(); } }; - }); + } + + var animateDown = function(element, className, done) { + if(className != 'active') { + return; + } + element.css({ + position: 'absolute', + left: 0, + top: 0 + }); + + jQuery(element).animate({ + top: -500 + }, done); + + return function(cancel) { + if(cancel) { + element.stop(); + } + }; + } + + return { + addClass: animateUp, + removeClass: animateDown + }; +});Note that we're using {@link http://jquery.com/ jQuery} to implement the animation. jQuery