Fade Anything Technique

Need to draw attention to something new on your Web page? Only need to show it for a moment or two? This JavaScript will highlight it in a subtle manner (or boldly, if you choose).




Over 2000+ free Javascript
at JavaScriptBank.com Website
Sampled by JavaScriptBank.com Reload this page to review

Lorem ipsum dolor sit amet, consectetuer adipiscing elit, sed diam nonummy nibh euismod tincidunt ut laoreet dolore magna aliquam erat volutpat. Ut wisi enim ad minim veniam, quis nostrud exerci tation ullamcorper suscipit lobortis nisl ut aliquip ex ea commodo consequat.

Ma quande lingues coalesce, li grammatica del resultant lingue es plu simplic e regulari quam ti del coalescent lingues. Li nov lingua franca va esser plu simplic e regulari quam li existent Europan lingues.

Lorem ipsum dolor sit amet, consectetuer adipiscing elit, sed diam nonummy nibh euismod tincidunt ut laoreet dolore magna aliquam erat volutpat. Ut wisi enim ad minim veniam, quis nostrud exerci tation ullamcorper suscipit lobortis nisl ut aliquip ex ea commodo consequat.

Basic:

Choose the element, such as a paragraph, you would like to spotlight and give it a class of "fade":

Watch me fade

The paragraph will fade from the default color of yellow (#FFFF33) to whatever it's native background color is.

Advanced

Change the default fade from color:

<p id="paragraph1" class="fade-0066FF">Watch me fade from Blue</p>

Fade an element after the page load from a script (such as after an Ajax transaction):

Fat.fade_element("paragraph1")

The Fat.fade_element() function accepts several arguments: Target ID, Frames Per Second, Fade Duration, Fade Color, Final Color.

For example, if you wanted to fade paragraph1 from red to green at 60 frames per second for 10 seconds:

Fat.fade_element("paragraph1", 60, 10000, "#FF0000", "#00CC00")

Please note, the ID of the element is a required argument. As such all elements that you wish to fade (even by class) must have some unique ID. The ID can be anything.