$(selector).glow(color, duration, steps);

Pass null or false for any value which you want to use the default. All arguments are optional.

The default color is #FFFF99, a light yellow.

Why use this when effects.highlight.js does the same thing?

Well, it's lighter weight than the whole UI library, and the $.animate interpolation doesn't seem to work correctly with non-white background colors.

So I wrote this, it was quick and dirty, and it understands all of the colors out there, has similar options, and is tiny.



Source code

Hit refresh to watch the demo again.

	$(document).ready(function() {
		setTimeout(function() { $('.sub blockquote').glow('red', 7000); }, 5000);
		setTimeout(function() { $('.background-test blockquote').glow('orange'); }, 10000);
		setTimeout(function() { $('h1').glow('purple', null, 100); }, 15000);
		setTimeout(function() { $('pre').glow('rgb(0,80,0)', null, 3); }, 15000);
		$('blockquote').click(function (x) { $(x.currentTarget).glow('magenta', 500, 100); });
		$('.background-test').click(function (x) { $(x.currentTarget).glow('grey', 500, 100); });


jQuery Glow demo

Here's a message you may want people to pay attention to. Click any of these boxes to glow magenta.

Div and then a blockquote

Here's a second (red) message you may want people to pay attention to.

Reverse color tests

Another color, entirely.

Reverse color test 2

Another color, entirely.