Yellow fade effect with JQuery

Question

I would like to implement something similar to 37Signals\'s Yellow Fade effect.

I am using Jquery 1.3.2

The code

(function($) {
   $.fn.yell         


        

Answer 1

function YellowFade(selector){
   $(selector)
      .css('opacity', 0)
      .animate({ backgroundColor: 'Yellow', opacity: 1.0 }, 1000)
      .animate({ backgroundColor: '#ffffff', opacity: 0.0}, 350, function() {
             this.style.removeAttribute('filter');
              });
}

The line this.style.removeAttribute('filter') is for an anti-aliasing bug in IE.

Now, call YellowFade from wherever, and pass your selector

YellowFade('#myDivId');

Credit: Phil Haack had a demo showing exactly how to do this. He was doing a demo on JQuery and ASPNet MVC.

Take a look at this video

Update: Did you take a look at the video? Forgot to mention this requires the JQuery.Color plugin