For those of you working with javascript without jQuery, Im sorry. After getting to know jQuery with several projects, Im a convert and never going back. To take a peek, head over to jQuery Home. Their documentation is great, but let me show you a common task that is really a breeze with jQuery.
Everyone has had to do the onMouseOver(dothis), onMouseOut(doThat). Well, jQuery has a nice built in function called hover. You use it like this:
$("td").hover(
function () {
$(this).addClass("hover");
},
function () {
$(this).removeClass("hover");
}
);
Lets break this down. The 1st part: $("td") invokes the query like portion of jQuery, and is called the selector. This is saying find any element in my DOM of the class td, then apply the hover attributes too it. The 1st function is run when you mouse into your td, and the 2nd when you mouse out, with some internal controls to ensure you dont get that annoying flicker. You can also see the addClass() and removeClass() functions, which do exactly like you would think, adding or removing classes from the results of your selector (all the tds).
I really think you owe it to yourself to check out jQuery. With some of the best documentation of any javascript library out there, small download, and tons of features and addons, its the best thing Javascript has going.
Example 1: onMouseOver / out
Everyone has had to do the onMouseOver(dothis), onMouseOut(doThat). Well, jQuery has a nice built in function called hover. You use it like this:
$("td").hover(
function () {
$(this).addClass("hover");
},
function () {
$(this).removeClass("hover");
}
);
Lets break this down. The 1st part: $("td") invokes the query like portion of jQuery, and is called the selector. This is saying find any element in my DOM of the class td, then apply the hover attributes too it. The 1st function is run when you mouse into your td, and the 2nd when you mouse out, with some internal controls to ensure you dont get that annoying flicker. You can also see the addClass() and removeClass() functions, which do exactly like you would think, adding or removing classes from the results of your selector (all the tds).
I really think you owe it to yourself to check out jQuery. With some of the best documentation of any javascript library out there, small download, and tons of features and addons, its the best thing Javascript has going.
#1 by Rey Bango - March 6, 2008 at 10:19 AM
#2 by webexpertise - April 1, 2009 at 1:24 PM
Jquery is definately my first choice but I also like prototype. Just try not to mix them in one page, it tends to get frowzy.