com.google.gwt.query.client.plugins
Class Effects

java.lang.Object
  com.google.gwt.query.client.GQuery
      com.google.gwt.query.client.plugins.QueuePlugin<Effects>
          com.google.gwt.query.client.plugins.Effects

All Implemented Interfaces:

Lazy<GQuery,LazyGQuery>

public class Effects
extends QueuePlugin<Effects>

Effects plugin for Gwt Query.

Nested Class Summary

static class	Effects.GQAnimation Class to access protected methods in Animation.
static class	Effects.Speed Just a class to store predefined speed constant values.

Nested classes/interfaces inherited from class com.google.gwt.query.client.plugins.QueuePlugin

QueuePlugin.DelayFunction

Nested classes/interfaces inherited from class com.google.gwt.query.client.GQuery

GQuery.Offset

Field Summary

static Class<Effects>

Effects

Fields inherited from class com.google.gwt.query.client.plugins.QueuePlugin

DEFAULT_NAME, JUMP_TO_END, Queue, QUEUE_DATA_PREFIX

Fields inherited from class com.google.gwt.query.client.GQuery

attributeImpl, body, currentContext, currentSelector, dataCache, document, engine, Events, GQUERY, Widgets, window

Constructor Summary

protected

Effects(GQuery gq)

Method Summary

Effects	animate(Object stringOrProperties, Function... funcs) The animate() method allows you to create animation effects on any numeric Attribute, CSS property, or color CSS property.
Effects	animate(Object stringOrProperties, int duration, Function... funcs) The animate() method allows you to create animation effects on any numeric Attribute, CSS properties, or color CSS property.
Effects	animate(Object stringOrProperties, int duration, PropertiesAnimation.Easing easing, Function... funcs) The animate() method allows you to create animation effects on any numeric Attribute, CSS property, or color CSS property.
Effects	clip(ClipAnimation.Action a, ClipAnimation.Corner c, ClipAnimation.Direction d, Function... f) Animate the set of matched elements using the clip property.
Effects	clip(ClipAnimation.Action a, ClipAnimation.Corner c, ClipAnimation.Direction d, int duration, Function... f) Animate the set of matched elements using the clip property.
Effects	clip(ClipAnimation.Action a, ClipAnimation.Corner c, Function... f) Animate the set of matched elements using the clip property.
Effects	clipAppear(Function... f) Reveal all matched elements by adjusting the clip property firing an optional callback after completion.
Effects	clipAppear(int millisecs, Function... f) Reveal all matched elements by adjusting the clip property firing an optional callback after completion.
Effects	clipDisappear(Function... f) Hide all matched elements by adjusting the clip property firing an optional callback after completion.
Effects	clipDisappear(int millisecs, Function... f) Hide all matched elements by adjusting the clip property firing an optional callback after completion.
Effects	clipDown(Function... f) Reveal all matched elements by adjusting the clip property firing an optional callback after completion.
Effects	clipDown(int millisecs, Function... f) Reveal all matched elements by adjusting the clip property firing an optional callback after completion.
Effects	clipToggle(Function... f) Toggle the visibility of all matched elements by adjusting the clip property and firing an optional callback after completion.
Effects	clipToggle(int millisecs, Function... f) Toggle the visibility of all matched elements by adjusting the clip property and firing an optional callback after completion.
Effects	clipUp(Function... f) Hide all matched elements by adjusting the clip property firing an optional callback after completion.
Effects	clipUp(int millisecs, Function... f) Hide all matched elements by adjusting the clip property firing an optional callback after completion.
Effects	fadeIn(Function... f) Fade in all matched elements by adjusting their opacity and firing an optional callback after completion.
Effects	fadeIn(int millisecs, Function... f) Fade in all matched elements by adjusting their opacity and firing an optional callback after completion.
Effects	fadeOut(Function... f) Fade out all matched elements by adjusting their opacity to 0, then setting display to "none" and firing an optional callback after completion.
Effects	fadeOut(int millisecs, Function... f) Fade out all matched elements by adjusting their opacity to 0, then setting display to "none" and firing an optional callback after completion.
Effects	fadeTo(int millisecs, double opacity, Function... f) Fade the opacity of all matched elements to a specified opacity and firing an optional callback after completion.
Effects	fadeToggle(Function... f) Display or hide the matched elements by animating their opacity.
Effects	fadeToggle(int millisecs, Function... f) Display or hide the matched elements by animating their opacity.
protected boolean	isOff()
Effects	slideDown(Function... f) Reveal all matched elements by adjusting their height and firing an optional callback after completion.
Effects	slideDown(int millisecs, Function... f) Reveal all matched elements by adjusting their height and firing an optional callback after completion.
Effects	slideLeft(Function... f) Hide all matched elements by adjusting their width and firing an optional callback after completion.
Effects	slideLeft(int millisecs, Function... f) Hide all matched elements by adjusting their width and firing an optional callback after completion.
Effects	slideRight(Function... f) Reveal all matched elements by adjusting their width and firing an optional callback after completion.
Effects	slideRight(int millisecs, Function... f) Reveal all matched elements by adjusting their width and firing an optional callback after completion.
Effects	slideToggle(int millisecs, Function... f) Toggle the visibility of all matched elements by adjusting their height and firing an optional callback after completion.
Effects	slideUp(Function... f) Hide all matched elements by adjusting their height and firing an optional callback after completion.
Effects	slideUp(int millisecs, Function... f) Hide all matched elements by adjusting their height and firing an optional callback after completion.
Effects	toggle(boolean showOrHide) Toggle displaying each of the set of matched elements.
Effects	toggle(int millisecs, Function... f) Toggle displaying each of the set of matched elements by animating the width, height, and opacity of the matched elements simultaneously.

Methods inherited from class com.google.gwt.query.client.plugins.QueuePlugin

clearQueue, clearQueue, delay, delay, dequeue, dequeue, dequeueIfNotDoneYet, queue, queue, queue, queue, queue, queue, queue, replacequeue, stop, stop, stop, stop, stop, stop

Methods inherited from class com.google.gwt.query.client.GQuery

$, $, $, $, $, $, $, $, $, $, $, $, $, $, $, $, $$, add, add, addClass, after, after, after, ajax, ajax, ajax, andSelf, append, append, append, appendTo, appendTo, appendTo, as, attr, attr, attr, attr, before, before, before, bind, bind, blur, change, children, children, cleanHtmlString, click, clone, closest, closest, closest, closest, contains, contains, contents, createLazy, css, css, css, css, css, css, css, css, cur, cur, data, data, data, data, data, dblclick, delegate, delegate, delegate, delegate, detach, detach, die, die, die, each, each, each, each, elements, empty, end, eq, error, filter, filter, find, first, focus, get, get, get, getAssociatedWidget, getContext, getJSON, getPreviousObject, getSelector, getStyleImpl, grep, gt, has, has, hasClass, height, height, height, hide, hover, html, html, id, id, index, innerHeight, innerWidth, insertAfter, insertAfter, insertAfter, insertBefore, insertBefore, insertBefore, is, isEmpty, isVisible, jsArrayToString, keydown, keydown, keypress, keypress, keyup, keyup, last, lazy, left, length, live, live, live, live, load, load, load, lt, map, mousedown, mousemove, mouseout, mouseover, mouseup, next, next, nextAll, nextUntil, not, not, not, offset, offsetParent, one, outerHeight, outerHeight, outerWidth, outerWidth, parent, parent, parents, parents, parentsUntil, position, post, prepend, prepend, prepend, prependTo, prependTo, prependTo, prev, prev, prevAll, prevUntil, prop, prop, prop, pushStack, registerPlugin, remove, remove, remove, removeAttr, removeClass, removeData, replaceAll, replaceAll, replaceAll, replaceWith, replaceWith, replaceWith, resize, resize, restoreCssAttrs, saveCssAttrs, scroll, scrollIntoView, scrollIntoView, scrollLeft, scrollLeft, scrollTo, scrollTop, scrollTop, select, setArray, setPreviousObject, setSelector, show, siblings, siblings, size, slice, submit, text, text, toggle, toggle, toggleClass, toggleClass, top, toString, toString, trigger, unbind, unbind, undelegate, undelegate, undelegate, undelegate, unique, unwrap, val, val, val, val, vals, visible, widget, widget, widgets, widgets, width, width, wrap, wrap, wrap, wrapAll, wrapAll, wrapAll, wrapInner, wrapInner, wrapInner

Methods inherited from class java.lang.Object

equals, finalize, getClass, hashCode, notify, notifyAll, wait, wait, wait

Field Detail

Effects

public static final Class<Effects> Effects

Constructor Detail

Effects

protected Effects(GQuery gq)

Method Detail

isOff

protected boolean isOff()

animate

public Effects animate(Object stringOrProperties,
                       int duration,
                       PropertiesAnimation.Easing easing,
                       Function... funcs)

The animate() method allows you to create animation effects on any numeric Attribute, CSS property, or color CSS property. 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:

  //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);
 

In addition to numeric values, each property can take the strings 'show', 'hide', and 'toggle'. These shortcuts allow for custom hiding and showing animations that take into account the display type of the element. Animated properties can also be relative. If a value is supplied with a leading += or -= sequence of characters, then the target value is computed by adding or subtracting the given number from the current value of the property. Example:

  //move the element from its original position to 500px to the left and 5OOpx down for 400ms.
  //use a swing easing function for the transition
  $("#foo").animate(Properties.create("{top:'+=500px',left:'+=500px'}"), 400, Easing.SWING);
 

For color css properties, values can be specified via hexadecimal or rgb or literal values. Example:

  $("#foo").animate("backgroundColor:'red', color:'#ffffff', borderColor:'rgb(129, 0, 70)'", 400, Easing.SWING);
  $("#foo").animate($$("{backgroundColor:'red', color:'#ffffff', borderColor:'rgb(129, 0, 70)'}"), 400, Easing.SWING);
 

Overrides:

animate in class GQuery

Parameters:

p - a Properties object containing css properties to animate.

funcs - an array of Function called once the animation is complete

duration - the duration in milliseconds of the animation

easing - the easing function to use for the transition

animate

public Effects animate(Object stringOrProperties,
                       Function... funcs)

The animate() method allows you to create animation effects on any numeric Attribute, CSS property, or color CSS property. 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:

  //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);
 

In addition to numeric values, each property can take the strings 'show', 'hide', and 'toggle'. These shortcuts allow for custom hiding and showing animations that take into account the display type of the element. Animated properties can also be relative. If a value is supplied with a leading += or -= sequence of characters, then the target value is computed by adding or subtracting the given number from the current value of the property. Example:

  //move the element from its original position to 500px to the left for 500ms and
  // change the background color of the element at the end of the animation
  $("#foo").animate("left:'+=500'", new Function(){
                  
                 public void f(Element e){
                   $(e).css(CSS.BACKGROUND_COLOR.with(RGBColor.RED);
                 }
                 
              });
 

The duration of the animation is 500ms. For color css properties, values can be specified via hexadecimal or rgb or literal values. Example:

  $("#foo").animate("backgroundColor:'red', color:'#ffffff', borderColor:'rgb(129, 0, 70)'");
 

Overrides:

animate in class GQuery

Parameters:

prop - the property to animate : "cssName:'value'"

funcs - an array of Function called once the animation is complete

animate

public Effects animate(Object stringOrProperties,
                       int duration,
                       Function... funcs)

The animate() method allows you to create animation effects on any numeric Attribute, CSS properties, or color CSS property. 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:

  //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);
 

In addition to numeric values, each property can take the strings 'show', 'hide', and 'toggle'. These shortcuts allow for custom hiding and showing animations that take into account the display type of the element. Animated properties can also be relative. If a value is supplied with a leading += or -= sequence of characters, then the target value is computed by adding or subtracting the given number from the current value of the property. Example:

  //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);
     }
  });
 

For color css properties, values can be specified via hexadecimal or rgb or literal values. Example:

  $("#foo").animate("backgroundColor:'red', color:'#ffffff', borderColor:'rgb(129, 0, 70)', 1000");
 

Overrides:

animate in class GQuery

Parameters:

prop - the property to animate : "cssName:'value'"

funcs - an array of Function called once the animation is complete

duration - the duration in milliseconds of the animation

clip

public Effects clip(ClipAnimation.Action a,
                    ClipAnimation.Corner c,
                    ClipAnimation.Direction d,
                    Function... f)

Animate the set of matched elements using the clip property. It is possible to show or hide a set of elements, specify the direction of the animation and the start corner of the effect. Finally it executes the set of functions passed as arguments.

clip

public Effects clip(ClipAnimation.Action a,
                    ClipAnimation.Corner c,
                    ClipAnimation.Direction d,
                    int duration,
                    Function... f)

Animate the set of matched elements using the clip property. It is possible to show or hide a set of elements, specify the direction of the animation and the start corner of the effect. Finally it executes the set of functions passed as arguments.

clip

public Effects clip(ClipAnimation.Action a,
                    ClipAnimation.Corner c,
                    Function... f)

Animate the set of matched elements using the clip property. It is possible to show or hide a set of elements, specify the direction of the animation and the start corner of the effect. Finally it executes the set of functions passed as arguments.

clipAppear

public Effects clipAppear(Function... f)

Reveal all matched elements by adjusting the clip property firing an optional callback after completion. The effect goes from the center to the perimeter.

clipAppear

public Effects clipAppear(int millisecs,
                          Function... f)

Reveal all matched elements by adjusting the clip property firing an optional callback after completion. The effect goes from the center to the perimeter.

clipDisappear

public Effects clipDisappear(Function... f)

Hide all matched elements by adjusting the clip property firing an optional callback after completion. The effect goes from the perimeter to the center.

clipDisappear

public Effects clipDisappear(int millisecs,
                             Function... f)

Hide all matched elements by adjusting the clip property firing an optional callback after completion. The effect goes from the perimeter to the center.

clipDown

public Effects clipDown(Function... f)

Reveal all matched elements by adjusting the clip property firing an optional callback after completion. The effect goes from the top to the bottom.

clipDown

public Effects clipDown(int millisecs,
                        Function... f)

Reveal all matched elements by adjusting the clip property firing an optional callback after completion. The effect goes from the top to the bottom.

clipToggle

public Effects clipToggle(Function... f)

Toggle the visibility of all matched elements by adjusting the clip property and firing an optional callback after completion. The effect goes from the bottom to the top.

clipToggle

public Effects clipToggle(int millisecs,
                          Function... f)

Toggle the visibility of all matched elements by adjusting the clip property and firing an optional callback after completion. The effect goes from the bottom to the top.

clipUp

public Effects clipUp(Function... f)

Hide all matched elements by adjusting the clip property firing an optional callback after completion. The effect goes from the bottom to the top.

clipUp

public Effects clipUp(int millisecs,
                      Function... f)

Hide all matched elements by adjusting the clip property firing an optional callback after completion. The effect goes from the bottom to the top.

fadeIn

public Effects fadeIn(Function... f)

Fade in all matched elements by adjusting their opacity and firing an optional callback after completion. Only the opacity is adjusted for this animation, meaning that all of the matched elements should already have some form of height and width associated with them.

Overrides:

fadeIn in class GQuery

fadeIn

public Effects fadeIn(int millisecs,
                      Function... f)

Fade in all matched elements by adjusting their opacity and firing an optional callback after completion. Only the opacity is adjusted for this animation, meaning that all of the matched elements should already have some form of height and width associated with them.

Overrides:

fadeIn in class GQuery

fadeOut

public Effects fadeOut(Function... f)

Fade out all matched elements by adjusting their opacity to 0, then setting display to "none" and firing an optional callback after completion. Only the opacity is adjusted for this animation, meaning that all of the matched elements should already have some form of height and width associated with them.

Overrides:

fadeOut in class GQuery

fadeOut

public Effects fadeOut(int millisecs,
                       Function... f)

Fade out all matched elements by adjusting their opacity to 0, then setting display to "none" and firing an optional callback after completion. Only the opacity is adjusted for this animation, meaning that all of the matched elements should already have some form of height and width associated with them.

Overrides:

fadeOut in class GQuery

fadeTo

public Effects fadeTo(int millisecs,
                      double opacity,
                      Function... f)

Fade the opacity of all matched elements to a specified opacity and firing an optional callback after completion. Only the opacity is adjusted for this animation, meaning that all of the matched elements should already have some form of height and width associated with them.

fadeToggle

public Effects fadeToggle(Function... f)

Display or hide the matched elements by animating their opacity. and firing an optional callback after completion. Only the opacity is adjusted for this animation, meaning that all of the matched elements should already have some form of height and width associated with them.

fadeToggle

public Effects fadeToggle(int millisecs,
                          Function... f)

Display or hide the matched elements by animating their opacity. and firing an optional callback after completion. Only the opacity is adjusted for this animation, meaning that all of the matched elements should already have some form of height and width associated with them.

Overrides:

fadeToggle in class GQuery

slideDown

public Effects slideDown(Function... f)

Reveal all matched elements by adjusting their height and firing an optional callback after completion.

Overrides:

slideDown in class GQuery

slideDown

public Effects slideDown(int millisecs,
                         Function... f)

Reveal all matched elements by adjusting their height and firing an optional callback after completion.

Overrides:

slideDown in class GQuery

slideLeft

public Effects slideLeft(Function... f)

Hide all matched elements by adjusting their width and firing an optional callback after completion.

slideLeft

public Effects slideLeft(int millisecs,
                         Function... f)

Hide all matched elements by adjusting their width and firing an optional callback after completion.

slideRight

public Effects slideRight(Function... f)

Reveal all matched elements by adjusting their width and firing an optional callback after completion.

slideRight

public Effects slideRight(int millisecs,
                          Function... f)

Reveal all matched elements by adjusting their width and firing an optional callback after completion.

slideToggle

public Effects slideToggle(int millisecs,
                           Function... f)

Toggle the visibility of all matched elements by adjusting their height and firing an optional callback after completion. Only the height is adjusted for this animation, causing all matched elements to be hidden or shown in a "sliding" manner

Overrides:

slideToggle in class GQuery

slideUp

public Effects slideUp(Function... f)

Hide all matched elements by adjusting their height and firing an optional callback after completion.

Overrides:

slideUp in class GQuery

slideUp

public Effects slideUp(int millisecs,
                       Function... f)

Hide all matched elements by adjusting their height and firing an optional callback after completion.

Overrides:

slideUp in class GQuery

toggle

public Effects toggle(boolean showOrHide)

Toggle displaying each of the set of matched elements.

Parameters:

showOrHide - A Boolean indicating whether to show or hide the elements.

toggle

public Effects toggle(int millisecs,
                      Function... f)

Toggle displaying each of the set of matched elements by animating the width, height, and opacity of the matched elements simultaneously. When these properties reach 0 after a hiding animation, the display style property is set to none to ensure that the element no longer affects the layout of the page.