From 7414641a8dbaf917e106895d64f54e1c401f28f3 Mon Sep 17 00:00:00 2001
From: =?UTF-8?q?Scott=20Gonz=C3=A1lez?=
Date: Thu, 23 May 2013 13:18:58 -0400
Subject: [PATCH 1/2] Documented color animation.
---
pages/color-animation.md | 40 ++++++++++++++++++++++++++++++++++++++++
1 file changed, 40 insertions(+)
create mode 100644 pages/color-animation.md
diff --git a/pages/color-animation.md b/pages/color-animation.md
new file mode 100644
index 00000000..4c749925
--- /dev/null
+++ b/pages/color-animation.md
@@ -0,0 +1,40 @@
+
+
+jQuery UI effects core adds the ability to animate color properties using `rgb()`,
+`rgba()`, hex values, or even color names such as `"aqua"`. Simply include the
+jQuery UI effects core file and [`.animate()`](http://api.jquery.com/animate/)
+will gain support for colors.
+
+The following properties are supported:
+
+* `backgroundColor`
+* `borderBottomColor`
+* `borderLeftColor`
+* `borderRightColor`
+* `borderTopColor`
+* `color`
+* `columnRuleColor`
+* `outlineColor`
+* `textDecorationColor`
+* `textEmphasisColor`
+
+Support for color animation comes from the
+[jQuery Color plugin](https://github.com/jquery/jquery-color). The Color plugin
+provides several functions for working with colors. For full documentation, please
+see the [jQuery Color documentation](https://github.com/jquery/jquery-color#readme).
+
+## Class Animations
+
+While there are use cases for directly animating individual color properties, it
+is often a better approach to contain the styles in a class. jQuery UI provides
+a few methods which will animate the addition or removal of a CSS class,
+specifically [`.addClass()`](/addClass/), [`.removeClass()`](/removeClass/),
+[`.toggleClass()`](/toggleClass/), and [`.switchClass()`](/switchClass/). These
+methods will automatically determine which properties need to change and apply
+the appropriate animations.
From b7ddd1d8078d35d824184fa99e759a8ef08b7fb1 Mon Sep 17 00:00:00 2001
From: =?UTF-8?q?Scott=20Gonz=C3=A1lez?=
Date: Thu, 23 May 2013 13:43:47 -0400
Subject: [PATCH 2/2] demo
---
pages/color-animation.md | 8 ++++++++
resources/color-animation.html | 34 ++++++++++++++++++++++++++++++++++
2 files changed, 42 insertions(+)
create mode 100644 resources/color-animation.html
diff --git a/pages/color-animation.md b/pages/color-animation.md
index 4c749925..7e40ef64 100644
--- a/pages/color-animation.md
+++ b/pages/color-animation.md
@@ -38,3 +38,11 @@ specifically [`.addClass()`](/addClass/), [`.removeClass()`](/removeClass/),
[`.toggleClass()`](/toggleClass/), and [`.switchClass()`](/switchClass/). These
methods will automatically determine which properties need to change and apply
the appropriate animations.
+
+## Example
+
+```html
+@partial(resources/color-animation.html)
+```
+
+
diff --git a/resources/color-animation.html b/resources/color-animation.html
new file mode 100644
index 00000000..705cece3
--- /dev/null
+++ b/resources/color-animation.html
@@ -0,0 +1,34 @@
+
+
+
+
+ Color Animation Demo
+
+
+
+
+
+
+
+