12.7. Animation/Effects

Many people become aware of jQuery through seeing one of its many impressive graphical effects.

Let's check out the fadeOut effect using our original example:

  1. Go back to default.htm, and change the helloJQuery() function to contain the following:

    $("#div1").fadeOut();
  2. Press F5 to run your application.

  3. Click the Hello jQuery button.

  4. The <div> should then fade out of view.

12.7.1. Effect Overloads

Most of the effects in jQuery are overloaded, allowing fine-grained control (see Table 12-6).

Table 12.6. Different Overloads of the fadeOut() Method
ExampleMeaning
$("#div1").fadeOut();Basic effect with default options
$("#div1").fadeOut(10000);Effect time specified in milliseconds
$("#div1").fadeOut('slow');Specifies the time the ...

Get Introducing .NET 4.0: with Visual Studio 2010 now with the O’Reilly learning platform.

O’Reilly members experience books, live events, courses curated by job role, and more from O’Reilly and nearly 200 top publishers.