Upgrade to ExtJS 4.0.1 - Released 05/18/2011
[extjs.git] / docs / source / Anim.html
index 0fa3c47..3b65c6a 100644 (file)
@@ -1,4 +1,21 @@
-<!DOCTYPE html><html><head><title>Sencha Documentation Project</title><link rel="stylesheet" href="../reset.css" type="text/css"><link rel="stylesheet" href="../prettify.css" type="text/css"><link rel="stylesheet" href="../prettify_sa.css" type="text/css"><script type="text/javascript" src="../prettify.js"></script></head><body onload="prettyPrint()"><pre class="prettyprint"><pre><span id='Ext-fx.Anim'>/**
+<!DOCTYPE html>
+<html>
+<head>
+  <meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
+  <title>The source code</title>
+  <link href="../prettify/prettify.css" type="text/css" rel="stylesheet" />
+  <script type="text/javascript" src="../prettify/prettify.js"></script>
+  <style type="text/css">
+    .highlight { display: block; background-color: #ddd; }
+  </style>
+  <script type="text/javascript">
+    function highlight() {
+      document.getElementById(location.hash.replace(/#/, "")).className = "highlight";
+    }
+  </script>
+</head>
+<body onload="prettyPrint(); highlight();">
+  <pre class="prettyprint lang-js"><span id='Ext-fx-Anim'>/**
 </span> * @class Ext.fx.Anim
  * 
  * This class manages animation for a specific {@link #target}. The animation allows
@@ -54,14 +71,14 @@ Ext.define('Ext.fx.Anim', {
     /* End Definitions */
 
     isAnimation: true,
-<span id='Ext-fx.Anim-cfg-duration'>    /**
+<span id='Ext-fx-Anim-cfg-duration'>    /**
 </span>     * @cfg {Number} duration
      * Time in milliseconds for a single animation to last. Defaults to 250. If the {@link #iterations} property is
      * specified, then each animate will take the same duration for each iteration.
      */
     duration: 250,
 
-<span id='Ext-fx.Anim-cfg-delay'>    /**
+<span id='Ext-fx-Anim-cfg-delay'>    /**
 </span>     * @cfg {Number} delay
      * Time to delay before starting the animation. Defaults to 0.
      */
@@ -70,13 +87,13 @@ Ext.define('Ext.fx.Anim', {
     /* private used to track a delayed starting time */
     delayStart: 0,
 
-<span id='Ext-fx.Anim-cfg-dynamic'>    /**
+<span id='Ext-fx-Anim-cfg-dynamic'>    /**
 </span>     * @cfg {Boolean} dynamic
      * Currently only for Component Animation: Only set a component's outer element size bypassing layouts.  Set to true to do full layouts for every frame of the animation.  Defaults to false.
      */
     dynamic: false,
 
-<span id='Ext-fx.Anim-cfg-easing'>    /**
+<span id='Ext-fx-Anim-cfg-easing'>    /**
 </span>     * @cfg {String} easing
 This describes how the intermediate values used during a transition will be calculated. It allows for a transition to change
 speed over its duration. 
@@ -99,7 +116,7 @@ as (x1, y1, x2, y2). All values must be in the range [0, 1] or the definition is
      */
     easing: 'ease',
 
-<span id='Ext-fx.Anim-cfg-keyframes'>     /**
+<span id='Ext-fx-Anim-cfg-keyframes'>     /**
 </span>      * @cfg {Object} keyframes
       * Animation keyframes follow the CSS3 Animation configuration pattern. 'from' is always considered '0%' and 'to'
       * is considered '100%'.&lt;b&gt;Every keyframe declaration must have a keyframe rule for 0% and 100%, possibly defined using
@@ -124,31 +141,31 @@ keyframes : {
  &lt;/code&gt;&lt;/pre&gt;
       */
 
-<span id='Ext-fx.Anim-property-damper'>    /**
+<span id='Ext-fx-Anim-property-damper'>    /**
 </span>     * @private
      */
     damper: 1,
 
-<span id='Ext-fx.Anim-property-bezierRE'>    /**
+<span id='Ext-fx-Anim-property-bezierRE'>    /**
 </span>     * @private
      */
     bezierRE: /^(?:cubic-)?bezier\(([^,]+),([^,]+),([^,]+),([^\)]+)\)/,
 
-<span id='Ext-fx.Anim-cfg-reverse'>    /**
+<span id='Ext-fx-Anim-cfg-reverse'>    /**
 </span>     * Run the animation from the end to the beginning
      * Defaults to false.
      * @cfg {Boolean} reverse
      */
     reverse: false,
 
-<span id='Ext-fx.Anim-property-running'>    /**
+<span id='Ext-fx-Anim-property-running'>    /**
 </span>     * Flag to determine if the animation has started
      * @property running
      * @type boolean
      */
     running: false,
 
-<span id='Ext-fx.Anim-property-paused'>    /**
+<span id='Ext-fx-Anim-property-paused'>    /**
 </span>     * Flag to determine if the animation is paused. Only set this to true if you need to
      * keep the Anim instance around to be unpaused later; otherwise call {@link #end}.
      * @property paused
@@ -156,41 +173,41 @@ keyframes : {
      */
     paused: false,
 
-<span id='Ext-fx.Anim-cfg-iterations'>    /**
+<span id='Ext-fx-Anim-cfg-iterations'>    /**
 </span>     * Number of times to execute the animation. Defaults to 1.
      * @cfg {int} iterations
      */
     iterations: 1,
 
-<span id='Ext-fx.Anim-cfg-alternate'>    /**
+<span id='Ext-fx-Anim-cfg-alternate'>    /**
 </span>     * Used in conjunction with iterations to reverse the animation each time an iteration completes.
      * @cfg {Boolean} alternate
      * Defaults to false.
      */
     alternate: false,
 
-<span id='Ext-fx.Anim-property-currentIteration'>    /**
+<span id='Ext-fx-Anim-property-currentIteration'>    /**
 </span>     * Current iteration the animation is running.
      * @property currentIteration
      * @type int
      */
     currentIteration: 0,
 
-<span id='Ext-fx.Anim-property-startTime'>    /**
+<span id='Ext-fx-Anim-property-startTime'>    /**
 </span>     * Starting time of the animation.
      * @property startTime
      * @type Date
      */
     startTime: 0,
 
-<span id='Ext-fx.Anim-property-propHandlers'>    /**
+<span id='Ext-fx-Anim-property-propHandlers'>    /**
 </span>     * Contains a cache of the interpolators to be used.
      * @private
      * @property propHandlers
      * @type Object
      */
 
-<span id='Ext-fx.Anim-cfg-target'>    /**
+<span id='Ext-fx-Anim-cfg-target'>    /**
 </span>     * @cfg {String/Object} target
      * The {@link Ext.fx.target.Target} to apply the animation to.  This should only be specified when creating an Ext.fx.Anim directly.
      * The target does not need to be a {@link Ext.fx.target.Target} instance, it can be the underlying object. For example, you can
@@ -198,7 +215,7 @@ keyframes : {
      * automatically.
      */
 
-<span id='Ext-fx.Anim-cfg-from'>    /**
+<span id='Ext-fx-Anim-cfg-from'>    /**
 </span>     * @cfg {Object} from
      * An object containing property/value pairs for the beginning of the animation.  If not specified, the current state of the
      * Ext.fx.target will be used. For example:
@@ -211,7 +228,7 @@ from : {
 &lt;/code&gt;&lt;/pre&gt;
      */
 
-<span id='Ext-fx.Anim-cfg-to'>    /**
+<span id='Ext-fx-Anim-cfg-to'>    /**
 </span>     * @cfg {Object} to
      * An object containing property/value pairs for the end of the animation. For example:
  &lt;pre&gt;&lt;code&gt;
@@ -252,20 +269,20 @@ from : {
         me.id = Ext.id(null, 'ext-anim-');
         Ext.fx.Manager.addAnim(me);
         me.addEvents(
-<span id='Ext-fx.Anim-event-beforeanimate'>            /**
+<span id='Ext-fx-Anim-event-beforeanimate'>            /**
 </span>             * @event beforeanimate
              * Fires before the animation starts. A handler can return false to cancel the animation.
              * @param {Ext.fx.Anim} this
              */
             'beforeanimate',
-<span id='Ext-fx.Anim-event-afteranimate'>             /**
+<span id='Ext-fx-Anim-event-afteranimate'>             /**
 </span>              * @event afteranimate
               * Fires when the animation is complete.
               * @param {Ext.fx.Anim} this
               * @param {Date} startTime
               */
             'afteranimate',
-<span id='Ext-fx.Anim-event-lastframe'>             /**
+<span id='Ext-fx-Anim-event-lastframe'>             /**
 </span>              * @event lastframe
               * Fires when the animation's last frame has been set.
               * @param {Ext.fx.Anim} this
@@ -280,7 +297,7 @@ from : {
         return me;
     },
 
-<span id='Ext-fx.Anim-method-setAttr'>    /**
+<span id='Ext-fx-Anim-method-setAttr'>    /**
 </span>     * @private
      * Helper to the target
      */
@@ -431,4 +448,6 @@ from : {
 });
 // Set flag to indicate that Fx is available. Class might not be available immediately.
 Ext.enableFx = true;
-</pre></pre></body></html>
\ No newline at end of file
+</pre>
+</body>
+</html>