Skip to content
Browse files

Added .addClass().

  • Loading branch information...
1 parent 6ef5cc8 commit 87b7a23a1f0b6a09811d51f97becf9de493676a0 @scottgonzalez scottgonzalez committed Aug 27, 2012
View
40 entries/addClass.xml
@@ -0,0 +1,40 @@
+<?xml version="1.0"?>
+<entry name="addClass" type="method" return="jQuery">
+ <title>.addClass()</title>
+ <desc>Adds the specified class(es) to each of the set of matched elements while animating all style changes.</desc>
+ <longdesc>
+ <p>Similar to native CSS transitions, jQuery UI's class animations provide a smooth transition from one state to another while allowing you to keep all the details about which styles to change in CSS and out of your JavaScript. All class animation methods, including <code>.addClass()</code>, support custom durations and easings, as well as providing a callback for when the animation completes.</p>
+ </longdesc>
+ <signature>
+ <argument name="className" type="String">
+ <desc>One or more class names to be added to the class attribute of each matched element.</desc>
+ </argument>
+ <xi:include href="../includes/animation-argument-duration.xml" xmlns:xi="http://www.w3.org/2003/XInclude"/>
+ <xi:include href="../includes/animation-argument-easing.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>
+ <example>
+ <desc>Adds the class "big-blue" to the matched elements.</desc>
+ <css><![CDATA[
+ div {
+ width: 100px;
+ height: 100px;
+ background-color: #ccc;
+ }
+ .big-blue {
+ width: 200px;
+ height: 200px;
+ background-color: #00f;
+ }
+]]></css>
+ <html><![CDATA[
+<div></div>
+]]></html>
+ <code><![CDATA[
+$( "div" ).click(function() {
+ $( this ).addClass( "big-blue", 1000, "easeOutBounce" );
+});
+]]></code>
+ </example>
+ <category slug="effects"/>
+</entry>
View
4 includes/animation-argument-complete.xml
@@ -0,0 +1,4 @@
+<?xml version="1.0"?>
+<argument name="complete" type="Function" optional="true">
+ <desc>A function to call once the animation is complete.</desc>
+</argument>
View
6 includes/animation-argument-duration.xml
@@ -0,0 +1,6 @@
+<?xml version="1.0"?>
+<argument name="duration" default="400" optional="true">
+ <desc>A string or number determining how long the animation will run.</desc>
+ <type name="Number"/>
+ <type name="String"/>
+</argument>
View
4 includes/animation-argument-easing.xml
@@ -0,0 +1,4 @@
+<?xml version="1.0"?>
+<argument name="easing" type="String" default="swing" optional="true">
+ <desc>A string indicating which easing function to use for the transition.</desc>
+</argument>

0 comments on commit 87b7a23

Please sign in to comment.
Something went wrong with that request. Please try again.