]> source.dussan.org Git - gwtquery.git/commitdiff
update animate javadoc
authorManolo Carrasco <manolo@apache.org>
Mon, 25 Apr 2011 09:35:27 +0000 (09:35 +0000)
committerManolo Carrasco <manolo@apache.org>
Mon, 25 Apr 2011 09:35:27 +0000 (09:35 +0000)
gwtquery-core/src/main/java/com/google/gwt/query/client/GQuery.java
gwtquery-core/src/main/java/com/google/gwt/query/client/LazyGQuery.java
gwtquery-core/src/main/java/com/google/gwt/query/client/plugins/Effects.java
gwtquery-core/src/main/java/com/google/gwt/query/client/plugins/LazyEffects.java

index 1fd4a1582f765974fc7541c5515c6e1fe4b7b190..bda6ba0b6e75c1a7cec7d7b3436885a252de4af2 100644 (file)
@@ -572,18 +572,23 @@ public class GQuery implements Lazy<GQuery, LazyGQuery> {
 \r
   /**\r
    * The animate() method allows you to create animation effects on any numeric\r
-   * CSS property or any color CSS property.\r
+   * Attribute, CSS property, or color CSS property.\r
    * \r
-   * Concerning numeric property, values are treated as a number of pixels\r
+   * Concerning to numeric properties, values are treated as a number of pixels\r
    * unless otherwise specified. The units em and % can be specified where\r
    * applicable.\r
    * \r
+   * By default animate considers css properties, if you wanted to animate element\r
+   * attributes you should to prepend the symbol dollar to the attribute name.\r
+   * \r
    * Example:\r
    * \r
    * <pre class="code">\r
    *  //move the element from its original position to the position top:500px and left:500px for 400ms.\r
    *  //use a swing easing function for the transition\r
    *  $("#foo").animate(Properties.create("{top:'500px',left:'500px'}"), 400, Easing.SWING);\r
+   *  // Change the width and border attributes of a table\r
+   *  $("table").animate(Properties.create("{$width: '500', $border: '10'}"), 400, Easing.LINEAR);\r
    * </pre>\r
    * \r
    * In addition to numeric values, each property can take the strings 'show',\r
@@ -624,17 +629,22 @@ public class GQuery implements Lazy<GQuery, LazyGQuery> {
   /**\r
    * \r
    * The animate() method allows you to create animation effects on any numeric\r
-   * CSS property or any color CSS property.\r
+   * Attribute, CSS property, or color CSS property.\r
    * \r
-   * Concerning numeric property, values are treated as a number of pixels\r
+   * Concerning to numeric properties, values are treated as a number of pixels\r
    * unless otherwise specified. The units em and % can be specified where\r
    * applicable.\r
    * \r
+   * By default animate considers css properties, if you wanted to animate element\r
+   * attributes you should to prepend the symbol dollar to the attribute name.\r
+   * \r
    * Example:\r
    * \r
    * <pre class="code">\r
    *  //move the element from its original position to left:500px for 500ms\r
    *  $("#foo").animate("left:'500'");\r
+   *  // Change the width attribute of a table\r
+   *  $("table").animate("$width:'500'"), 400, Easing.LINEAR);\r
    * </pre>\r
    * \r
    * In addition to numeric values, each property can take the strings 'show',\r
@@ -679,17 +689,22 @@ public class GQuery implements Lazy<GQuery, LazyGQuery> {
 \r
   /**\r
    * The animate() method allows you to create animation effects on any numeric\r
-   * CSS property or any color CSS property.\r
+   * Attribute, CSS properties, or color CSS property.\r
    * \r
-   * Concerning numeric property, values are treated as a number of pixels\r
+   * Concerning to numeric property, values are treated as a number of pixels\r
    * unless otherwise specified. The units em and % can be specified where\r
    * applicable.\r
    * \r
+   * By default animate considers css properties, if you wanted to animate element\r
+   * attributes you should to prepend the symbol dollar to the attribute name.\r
+   * \r
    * Example:\r
    * \r
    * <pre class="code">\r
    *  //move the element from its original position to left:500px for 2s\r
    *  $("#foo").animate("left:'500px'", 2000);\r
+   *  // Change the width attribute of a table\r
+   *  $("table").animate("$width:'500'"), 400);\r
    * </pre>\r
    * \r
    * In addition to numeric values, each property can take the strings 'show',\r
@@ -705,12 +720,10 @@ public class GQuery implements Lazy<GQuery, LazyGQuery> {
    *  //move the element from its original position to 500px to the left for 1000ms and\r
    *  // change the background color of the element at the end of the animation\r
    *  $("#foo").animate("left:'+=500'", 1000, new Function(){\r
-   *                  \r
-   *                 public void f(Element e){\r
-   *                   $(e).css(CSS.BACKGROUND_COLOR.with(RGBColor.RED);\r
-   *                 }\r
-   *                 \r
-   *              });\r
+   *     public void f(Element e){\r
+   *       $(e).css(CSS.BACKGROUND_COLOR.with(RGBColor.RED);\r
+   *     }\r
+   *  });\r
    * </pre>\r
    * \r
    * \r
index f53506db0503d4c3bf16914a2dbbc67c2ad21c5c..ff82f79d137e8a2a2057ec85e54a3dfc8c39caf5 100644 (file)
@@ -107,18 +107,23 @@ public interface LazyGQuery<T> extends LazyBase<T>{
 
   /**
    * The animate() method allows you to create animation effects on any numeric
-   * CSS property or any color CSS property.
+   * Attribute, CSS property, or color CSS property.
    * 
-   * Concerning numeric property, values are treated as a number of pixels
+   * Concerning to numeric properties, values are treated as a number of pixels
    * unless otherwise specified. The units em and % can be specified where
    * applicable.
    * 
+   * By default animate considers css properties, if you wanted to animate element
+   * attributes you should to prepend the symbol dollar to the attribute name.
+   * 
    * Example:
    * 
    * <pre class="code">
    *  //move the element from its original position to the position top:500px and left:500px for 400ms.
    *  //use a swing easing function for the transition
    *  $("#foo").animate(Properties.create("{top:'500px',left:'500px'}"), 400, Easing.SWING);
+   *  // Change the width and border attributes of a table
+   *  $("table").animate(Properties.create("{$width: '500', $border: '10'}"), 400, Easing.LINEAR);
    * </pre>
    * 
    * In addition to numeric values, each property can take the strings 'show',
@@ -156,17 +161,22 @@ public interface LazyGQuery<T> extends LazyBase<T>{
   /**
    * 
    * The animate() method allows you to create animation effects on any numeric
-   * CSS property or any color CSS property.
+   * Attribute, CSS property, or color CSS property.
    * 
-   * Concerning numeric property, values are treated as a number of pixels
+   * Concerning to numeric properties, values are treated as a number of pixels
    * unless otherwise specified. The units em and % can be specified where
    * applicable.
    * 
+   * By default animate considers css properties, if you wanted to animate element
+   * attributes you should to prepend the symbol dollar to the attribute name.
+   * 
    * Example:
    * 
    * <pre class="code">
    *  //move the element from its original position to left:500px for 500ms
    *  $("#foo").animate("left:'500'");
+   *  // Change the width attribute of a table
+   *  $("table").animate("$width:'500'"), 400, Easing.LINEAR);
    * </pre>
    * 
    * In addition to numeric values, each property can take the strings 'show',
@@ -209,17 +219,22 @@ public interface LazyGQuery<T> extends LazyBase<T>{
 
   /**
    * The animate() method allows you to create animation effects on any numeric
-   * CSS property or any color CSS property.
+   * Attribute, CSS properties, or color CSS property.
    * 
-   * Concerning numeric property, values are treated as a number of pixels
+   * Concerning to numeric property, values are treated as a number of pixels
    * unless otherwise specified. The units em and % can be specified where
    * applicable.
    * 
+   * By default animate considers css properties, if you wanted to animate element
+   * attributes you should to prepend the symbol dollar to the attribute name.
+   * 
    * Example:
    * 
    * <pre class="code">
    *  //move the element from its original position to left:500px for 2s
    *  $("#foo").animate("left:'500px'", 2000);
+   *  // Change the width attribute of a table
+   *  $("table").animate("$width:'500'"), 400);
    * </pre>
    * 
    * In addition to numeric values, each property can take the strings 'show',
@@ -235,12 +250,10 @@ public interface LazyGQuery<T> extends LazyBase<T>{
    *  //move the element from its original position to 500px to the left for 1000ms and
    *  // change the background color of the element at the end of the animation
    *  $("#foo").animate("left:'+=500'", 1000, new Function(){
-   *                  
-   *                 public void f(Element e){
-   *                   $(e).css(CSS.BACKGROUND_COLOR.with(RGBColor.RED);
-   *                 }
-   *                 
-   *              });
+   *     public void f(Element e){
+   *       $(e).css(CSS.BACKGROUND_COLOR.with(RGBColor.RED);
+   *     }
+   *  });
    * </pre>
    * 
    * 
index e45c1e957601247b38c9b5a5554739311c36c77b..32ad902cac7c10def3143fe634195517a8c06441 100755 (executable)
@@ -58,18 +58,23 @@ public class Effects extends QueuePlugin<Effects> {
 \r
   /**\r
    * The animate() method allows you to create animation effects on any numeric\r
-   * CSS property or any color CSS property.\r
+   * Attribute, CSS property, or color CSS property.\r
    * \r
-   * Concerning numeric property, values are treated as a number of pixels\r
+   * Concerning to numeric properties, values are treated as a number of pixels\r
    * unless otherwise specified. The units em and % can be specified where\r
    * applicable.\r
    * \r
+   * By default animate considers css properties, if you wanted to animate element\r
+   * attributes you should to prepend the symbol dollar to the attribute name.\r
+   * \r
    * Example:\r
    * \r
    * <pre class="code">\r
    *  //move the element from its original position to the position top:500px and left:500px for 400ms.\r
    *  //use a swing easing function for the transition\r
    *  $("#foo").animate(Properties.create("{top:'500px',left:'500px'}"), 400, Easing.SWING);\r
+   *  // Change the width and border attributes of a table\r
+   *  $("table").animate(Properties.create("{$width: '500', $border: '10'}"), 400, Easing.LINEAR);\r
    * </pre>\r
    * \r
    * In addition to numeric values, each property can take the strings 'show',\r
@@ -95,6 +100,12 @@ public class Effects extends QueuePlugin<Effects> {
    * <pre class="code">\r
    *  $("#foo").animate(Properties.create("{backgroundColor:'red', color:'#ffffff', borderColor:'rgb(129, 0, 70)'}"), 400, Easing.SWING);\r
    * </pre>\r
+   * \r
+   * @param p a {@link Properties} object containing css properties to animate.\r
+   * @param funcs an array of {@link Function} called once the animation is\r
+   *          complete\r
+   * @param duration the duration in milliseconds of the animation\r
+   * @param easing the easing function to use for the transition\r
    */\r
   public Effects animate(final Properties p, final int duration,\r
       final Easing easing, final Function... funcs) {\r
@@ -116,18 +127,24 @@ public class Effects extends QueuePlugin<Effects> {
   }\r
 \r
   /**\r
+   * \r
    * The animate() method allows you to create animation effects on any numeric\r
-   * CSS property or any color CSS property.\r
+   * Attribute, CSS property, or color CSS property.\r
    * \r
-   * Concerning numeric property, values are treated as a number of pixels\r
+   * Concerning to numeric properties, values are treated as a number of pixels\r
    * unless otherwise specified. The units em and % can be specified where\r
    * applicable.\r
    * \r
+   * By default animate considers css properties, if you wanted to animate element\r
+   * attributes you should to prepend the symbol dollar to the attribute name.\r
+   * \r
    * Example:\r
    * \r
    * <pre class="code">\r
    *  //move the element from its original position to left:500px for 500ms\r
    *  $("#foo").animate("left:'500'");\r
+   *  // Change the width attribute of a table\r
+   *  $("table").animate("$width:'500'"), 400, Easing.LINEAR);\r
    * </pre>\r
    * \r
    * In addition to numeric values, each property can take the strings 'show',\r
@@ -161,6 +178,10 @@ public class Effects extends QueuePlugin<Effects> {
    * <pre class="code">\r
    *  $("#foo").animate("backgroundColor:'red', color:'#ffffff', borderColor:'rgb(129, 0, 70)'");\r
    * </pre>\r
+   * \r
+   * @param prop the property to animate : "cssName:'value'"\r
+   * @param funcs an array of {@link Function} called once the animation is\r
+   *          complete\r
    */\r
   public Effects animate(String prop, Function... funcs) {\r
     return animate(prop, 500, funcs);\r
@@ -168,17 +189,22 @@ public class Effects extends QueuePlugin<Effects> {
 \r
   /**\r
    * The animate() method allows you to create animation effects on any numeric\r
-   * CSS property or any color CSS property.\r
+   * Attribute, CSS properties, or color CSS property.\r
    * \r
-   * Concerning numeric property, values are treated as a number of pixels\r
+   * Concerning to numeric property, values are treated as a number of pixels\r
    * unless otherwise specified. The units em and % can be specified where\r
    * applicable.\r
    * \r
+   * By default animate considers css properties, if you wanted to animate element\r
+   * attributes you should to prepend the symbol dollar to the attribute name.\r
+   * \r
    * Example:\r
    * \r
    * <pre class="code">\r
    *  //move the element from its original position to left:500px for 2s\r
    *  $("#foo").animate("left:'500px'", 2000);\r
+   *  // Change the width attribute of a table\r
+   *  $("table").animate("$width:'500'"), 400);\r
    * </pre>\r
    * \r
    * In addition to numeric values, each property can take the strings 'show',\r
@@ -194,12 +220,10 @@ public class Effects extends QueuePlugin<Effects> {
    *  //move the element from its original position to 500px to the left for 1000ms and\r
    *  // change the background color of the element at the end of the animation\r
    *  $("#foo").animate("left:'+=500'", 1000, new Function(){\r
-   *                  \r
-   *                 public void f(Element e){\r
-   *                   $(e).css(CSS.BACKGROUND_COLOR.with(RGBColor.RED);\r
-   *                 }\r
-   *                 \r
-   *              });\r
+   *     public void f(Element e){\r
+   *       $(e).css(CSS.BACKGROUND_COLOR.with(RGBColor.RED);\r
+   *     }\r
+   *  });\r
    * </pre>\r
    * \r
    * \r
@@ -212,6 +236,11 @@ public class Effects extends QueuePlugin<Effects> {
    *  $("#foo").animate("backgroundColor:'red', color:'#ffffff', borderColor:'rgb(129, 0, 70)', 1000");\r
    * </pre>\r
    * \r
+   * \r
+   * @param prop the property to animate : "cssName:'value'"\r
+   * @param funcs an array of {@link Function} called once the animation is\r
+   *          complete\r
+   * @param duration the duration in milliseconds of the animation\r
    */\r
   public Effects animate(String prop, int duration, Function... funcs) {\r
     return animate($$(prop), duration, Easing.LINEAR, funcs);\r
index e036169ba947e1ad6d945eb7ab0a2ada63ac1afd..0a60c32d0cfd406a0c959c04f9f4ad3d82cb4aaa 100644 (file)
@@ -30,18 +30,23 @@ public interface LazyEffects<T> extends LazyBase<T>{
 
   /**
    * The animate() method allows you to create animation effects on any numeric
-   * CSS property or any color CSS property.
+   * Attribute, CSS property, or color CSS property.
    * 
-   * Concerning numeric property, values are treated as a number of pixels
+   * Concerning to numeric properties, values are treated as a number of pixels
    * unless otherwise specified. The units em and % can be specified where
    * applicable.
    * 
+   * By default animate considers css properties, if you wanted to animate element
+   * attributes you should to prepend the symbol dollar to the attribute name.
+   * 
    * Example:
    * 
    * <pre class="code">
    *  //move the element from its original position to the position top:500px and left:500px for 400ms.
    *  //use a swing easing function for the transition
    *  $("#foo").animate(Properties.create("{top:'500px',left:'500px'}"), 400, Easing.SWING);
+   *  // Change the width and border attributes of a table
+   *  $("table").animate(Properties.create("{$width: '500', $border: '10'}"), 400, Easing.LINEAR);
    * </pre>
    * 
    * In addition to numeric values, each property can take the strings 'show',
@@ -67,22 +72,34 @@ public interface LazyEffects<T> extends LazyBase<T>{
    * <pre class="code">
    *  $("#foo").animate(Properties.create("{backgroundColor:'red', color:'#ffffff', borderColor:'rgb(129, 0, 70)'}"), 400, Easing.SWING);
    * </pre>
+   * 
+   * @param p a {@link Properties} object containing css properties to animate.
+   * @param funcs an array of {@link Function} called once the animation is
+   *          complete
+   * @param duration the duration in milliseconds of the animation
+   * @param easing the easing function to use for the transition
    */
   LazyEffects<T> animate(Properties p, int duration, Easing easing, Function... funcs);
 
   /**
+   * 
    * The animate() method allows you to create animation effects on any numeric
-   * CSS property or any color CSS property.
+   * Attribute, CSS property, or color CSS property.
    * 
-   * Concerning numeric property, values are treated as a number of pixels
+   * Concerning to numeric properties, values are treated as a number of pixels
    * unless otherwise specified. The units em and % can be specified where
    * applicable.
    * 
+   * By default animate considers css properties, if you wanted to animate element
+   * attributes you should to prepend the symbol dollar to the attribute name.
+   * 
    * Example:
    * 
    * <pre class="code">
    *  //move the element from its original position to left:500px for 500ms
    *  $("#foo").animate("left:'500'");
+   *  // Change the width attribute of a table
+   *  $("table").animate("$width:'500'"), 400, Easing.LINEAR);
    * </pre>
    * 
    * In addition to numeric values, each property can take the strings 'show',
@@ -116,22 +133,31 @@ public interface LazyEffects<T> extends LazyBase<T>{
    * <pre class="code">
    *  $("#foo").animate("backgroundColor:'red', color:'#ffffff', borderColor:'rgb(129, 0, 70)'");
    * </pre>
+   * 
+   * @param prop the property to animate : "cssName:'value'"
+   * @param funcs an array of {@link Function} called once the animation is
+   *          complete
    */
   LazyEffects<T> animate(String prop, Function... funcs);
 
   /**
    * The animate() method allows you to create animation effects on any numeric
-   * CSS property or any color CSS property.
+   * Attribute, CSS properties, or color CSS property.
    * 
-   * Concerning numeric property, values are treated as a number of pixels
+   * Concerning to numeric property, values are treated as a number of pixels
    * unless otherwise specified. The units em and % can be specified where
    * applicable.
    * 
+   * By default animate considers css properties, if you wanted to animate element
+   * attributes you should to prepend the symbol dollar to the attribute name.
+   * 
    * Example:
    * 
    * <pre class="code">
    *  //move the element from its original position to left:500px for 2s
    *  $("#foo").animate("left:'500px'", 2000);
+   *  // Change the width attribute of a table
+   *  $("table").animate("$width:'500'"), 400);
    * </pre>
    * 
    * In addition to numeric values, each property can take the strings 'show',
@@ -147,12 +173,10 @@ public interface LazyEffects<T> extends LazyBase<T>{
    *  //move the element from its original position to 500px to the left for 1000ms and
    *  // change the background color of the element at the end of the animation
    *  $("#foo").animate("left:'+=500'", 1000, new Function(){
-   *                  
-   *                 public void f(Element e){
-   *                   $(e).css(CSS.BACKGROUND_COLOR.with(RGBColor.RED);
-   *                 }
-   *                 
-   *              });
+   *     public void f(Element e){
+   *       $(e).css(CSS.BACKGROUND_COLOR.with(RGBColor.RED);
+   *     }
+   *  });
    * </pre>
    * 
    * 
@@ -165,6 +189,11 @@ public interface LazyEffects<T> extends LazyBase<T>{
    *  $("#foo").animate("backgroundColor:'red', color:'#ffffff', borderColor:'rgb(129, 0, 70)', 1000");
    * </pre>
    * 
+   * 
+   * @param prop the property to animate : "cssName:'value'"
+   * @param funcs an array of {@link Function} called once the animation is
+   *          complete
+   * @param duration the duration in milliseconds of the animation
    */
   LazyEffects<T> animate(String prop, int duration, Function... funcs);