Permalink
Browse files

Added .effect() method.

  • Loading branch information...
1 parent f601674 commit 870a619690612852c7b5b55cba06e95d24dfb7cb @scottgonzalez scottgonzalez committed Aug 30, 2012
Showing with 59 additions and 0 deletions.
  1. +59 −0 entries/effect.xml
View
59 entries/effect.xml
@@ -0,0 +1,59 @@
+<?xml version="1.0"?>
+<entry name="effect" type="method" return="jQuery">
+ <title>.effect()</title>
+ <desc>Apply an animation effect to an element.</desc>
+ <longdesc>
+ <p>The <code>.effect()</code> method applies a named animation <a href="/category/effects/">effect</a> to an element. Many effects also support a show or hide mode, which can be accomplished with the <a href="/show/"><code>.show()</code></a>, <a href="/hide/"><code>.hide()</code></a>, and <a href="/toggle/"><code>.toggle()</code></a> methods.</p>
+ </longdesc>
+ <signature>
+ <argument name="effect" type="String">
+ <desc>A string indicating which <a href="/category/effect/">effect</a> to use for the transition.</desc>
+ </argument>
+ <argument name="options" type="Object" optional="true">
+ <desc>Effect-specific settings and easing.</desc>
+ </argument>
+ <xi:include href="../includes/animation-argument-duration.xml" xmlns:xi="http://www.w3.org/2003/XInclude"/>
+ <xi:include href="../includes/animation-argument-complete.xml" xmlns:xi="http://www.w3.org/2003/XInclude"/>
+ </signature>
+ <signature>
+ <argument name="options" type="Object">
+ <desc>All animation settings. The only required property is <code>effect</code>.</desc>
+ <property name="effect" type="String">
+ <desc>A string indicating which <a href="/category/effect/">effect</a> to use for the transition.</desc>
+ </property>
+ <property name="easing" type="String">
+ <desc>A string indicating which easing function to use for the transition.</desc>
+ </property>
+ <property name="duration">
+ <desc>A string or number determining how long the animation will run.</desc>
+ <type name="Number"/>
+ <type name="String"/>
+ </property>
+ <property name="complete" type="Function">
+ <desc>A function to call once the animation is complete.</desc>
+ </property>
+ </argument>
+ </signature>
+ <example>
+ <desc>Apply the bounce effect to a div.</desc>
+ <css><![CDATA[
+ div {
+ width: 100px;
+ height: 100px;
+ background: #ccc;
+ border: 1px solid #000;
+ }
+]]></css>
+ <html><![CDATA[
+<p>Click anywhere to apply the effect.</p>
+<div></div>
+]]></html>
+ <code><![CDATA[
+$( document ).click(function() {
+ $( "div" ).effect( "bounce", "slow" );
+});
+]]></code>
+ </example>
+ <category slug="methods"/>
+ <category slug="effects"/>
+</entry>

0 comments on commit 870a619

Please sign in to comment.