Color Range 0.1

The ColorRange class is a simple utility that creates a range of colors to be used on elements of your choice. All you need is two colors and a selection of elements to apply a range of colors to and you're done.

ColorRange will work with MooTools 1.3 and 1.4 (without needing compatibility).



Details

Author
akaIDIOT
Current version
0.1
GitHub
akaIDIOT/MooTools-ColorRange
Downloads
2148
Category
Utilities
Tags
Report
GitHub Issues

Releases


Dependencies

  • core/1.4: *
  • more/1.4: Utilities.Color

How to use

Default, a newly created ColorRange object simply defines the range you supplied and nothing else. It can be used to apply the range to an element selection or selector. There are multiply ways to accomplish this; the following examples will all yield the same result:

// create a color range and use it on the page's menu items 
var myRange = new ColorRange('#f00', [0, 0, 255]);
myRange.apply($$('#menu li'));

// apply a color range to the page's menu items 
$$('#menu li').applyColorRange('#f00', '#00f');

// call a utility function to color the page's menu items 
Color.applyRange('#f00', '#00f', '#menu li');

All the options of the ColorRange class are described below.


Constructor

Syntax:

var myRange = new ColorRange(from, to);

Arguments:

  1. from - (color) The starting color. This argument can be anything accepted by the constructor of Color.
  2. to - (color) The ending color, like the first argument.

Apply

Applies a color range to a property of all the passed elements. Returns the ColorRange instance.

Syntax:

myRange.apply(elements[, property]);

Arguments:

  1. elements - (elements or string) The selection of elements to apply the color range to, either an Elements object or a selector string.
  2. property - (string, optional) The property to apply the colors to, defaults to background-color.

Color Range

Utility to create a new color range from the Color class.

Syntax:

Color.range(from, to);

Arguments:

See Constructor.


Color Applyrange

Utility to apply a color range to a selection of elements.

Syntax:

Color.applyRange(from, to, elements[, property]);

Arguments:

  1. from - (color) See Constructor.
  2. to - (color) See Constructor.
  3. elements - (elements or string) See apply.
  4. property - (string, optional) See apply.

Elements Applycolorrange

Utility to apply a color range to an element collection.

Syntax:

$$('li.someClass').applyColorRange(from, to[, property]);

Arguments:

  1. from - (color) See Constructor.
  2. to - (color) See Constructor.
  3. property - (string, optional) See apply.

Changelog

0.2

  • update to MooTools 1.4 (functional code unchanged)

0.1

  • initial release

Discuss

A note on comments here: These comments are moderated. No comments will show up until they are approved. Comments that are not productive (i.e. inflammatory, rude, etc) will not be approved.

Found a bug in this plugin? Please report it this repository's Github Issues.

blog comments powered by Disqus