WordPress jQuery UI Effects

January 05, 2010

WordPress jQuery UI Effects Plugin

Use effects of the jQuery UI Effects library in your themes and plugins!

Easily register and load the effects of the jQuery UI Effects library in your themes and plugins.

Supported effects:

  • Blind – Blinds the element away or shows it by blinding it in.
  • Clip – Clips the element on or off, vertically or horizontally.
  • Drop – Drops the element away or shows it by dropping it in.
  • Explode – Explodes the element into multiple pieces.
  • Fold – Folds the element like a piece of paper.
  • Puff – Scale and fade out animations create the puff effect.
  • Slide – Slides the element out of the viewport.
  • Scale – Shrink or grow an element by a percentage factor.
  • Bounce – Bounces the element vertically or horizontally n-times.
  • Highlight – Highlights the background with a defined color.
  • Pulsate – Pulsates the opacity of the element multiple times.
  • Shake – Shakes the element vertically or horizontally n-times.
  • Size – Resize an element to a specified width and height.
  • Transfer – Transfers the outline of an element to another.

Requirements

WordPress jQuery UI Effects requires PHP5.

Installation

  1. Upload wp-jquery-ui-effects folder and all it’s contents to the /wp-content/plugins/ directory.
  2. Activate the plugin through the ‘Plugins’ menu in WordPress.
  3. Refer to the FAQ for usage and tips.

FAQ

How do I use this plugin?

In your theme or plugin, if you want to load the Bounce effect, use wp_enqueue_script:

<?php function my_init_method() { wp_enqueue_script('jquery-ui-effects-bounce'); } add_action('init', 'my_init_method'); ?> 

WordPress charge jQuery, jQuery UI Effects Core and jQuery UI Effects Bounce.
Note that all effect scripts are loaded in the footer.

Load script depends on jQuery UI Effect Highlight

Add and load a new script that depends on jQuery UI Effect Highlight:

<?php wp_enqueue_script( 'my-script', get_bloginfo('template_url', 'raw') . '/js/my-script.js', array('jquery-ui-effects-highlight'), '1.0', true ); ?> 

How to find the name of scripts available?

Prefixing the name of the effect by jquery-ui-effects-. Lowercase string.

For example, load the Shake effect with:

  • jquery-ui-effects-shake.
  • or by using the static method WPjQueryUIEffects::getHandle('shake').

jQuery UI is it necessary to run jQuery UI Effects?

No. Please note that jquery-ui-core (ui.core.js file) is not a dependency for the effects to work.

Wich is the version of jQuery UI Effects used by the plugin?

The WP jQuery UI Effects plugin use the version 1.7.2. Requires jQuery 1.3+.

Can I make a suggestion for a new feature or report a bug?

Sure can! Add your feature request or report your bug report other at the bug tracker.

Changelog

1.0.0

  • Initial release.

Details

  • Version: 1.0.0
  • Active installations: 60
  • WordPress Version: 2.8
  • Tested up to: 3.0.5

Ratings


5 Stars
4 Stars
3 Stars
2 Stars
1 Stars