246996016-HTML5-Step-by-Step

296 Chapter 16
You can also select elements by their cascading style sheet (CSS) class with a dot prefix,
similar to that used in the CSS file itself:
$(".className")
jQuery provides several other ways to select elements, including hierarchical functions
by which you can select the children of an element; a way to select every other element
except a specified element; an element’s parent elements; and many other selectors. See
http://api.jquery.com/category/selectors for information on all the available selectors in
jQuery.
What can you do with a selected element? The answers are virtually limitless. For
instance, recall that in an example in an earlier chapter you changed the background
color of the to gray using JavaScript. Here’s how you would do the same thing
using jQuery:
$("#contentDiv").css("backgroundColor","#abacab");
Here’s a bonus example using the jQuery fadeOut() function:
jQuery 101
Your second JavaScript page.
$("#contentDiv").css("backgroundColor", "#abacab");
$("#contentDiv").fadeOut();
Viewing this page in a browser will result in the contentDiv fading out after a certain
default (and short) time period. If you find that time period too short, you can specify the
duration, as well. Time is measured in milliseconds for this (and most other) functions in
jQuery, so every second is 1000 milliseconds. Therefore, to set the fade-out duration to
5 seconds, you would write:
$("#contentDiv").fadeOut(5000);
See Also The .fadeOut() function accepts other arguments as well. See http://api.jquery.com/
fadeOut/ for more information on how to use this function.