Child pages
  • Using jQuery and Ajax

Versions Compared

Key

  • This line was added.
  • This line was removed.
  • Formatting was changed.

...

  • When using a function as its parameter, $() will execute the function once the page's DOM is fully loaded.
    For instance: $(function(){ /* do something */ });
  • When passing a string containing a CSS selector, $() will return all the HTML nodes which match the selector.
    For instance: $('ul#nav');
  • That set of nodes can then be assigned to any of jQuery's methods. For instance, if you want to hide the navigation element returned by the above selector.
    For instance: $('ul#nav').slideUp('fast');
  • When using pure HTML code as its parameter, $() will create the node (DOM element). That node can, again, be used with any of jQuery's methods.
    For instance: $("<li>Sign Off</li>").appendTo("ul#nav");

Note

$() is merely a shortcut to the library-specific jQuery() function. It exists in order to accelerate coding. Many other JavaScript libraries use $() for their shortcut.

Hence, these two lines are equivalent:

Code Block
$('ul#nav').slideUp('fast'); 
jQuery('ul#nav').slideUp('fast');

 

If you are mixing JavaScript libraries in your theme, you might be better off by telling jQuery to free $(). Simply call $.noConflict(), and from then on, any call to jQuery will require you to use jQuery() instead of $().

...

In order to associate a function to a click event, simple add .click(function).
In order to generate a click event, you can also use .click() with any parameter. For instance: $('#button').click(function(){/* do something */});

...

Plugin file name

Plugin description

jquery.colorpicker

Photoshop-style color selector.

jquery.cookie-plugin

Read, write and delete cookies.

jquery.dimensions

Manage an element's dimensions.

jquery.easing

Manage the speed of an animation.

jquery.excanvas

Change the canvas of an element (rounded corners / gradients / opacity / draw line, arc, etc.)

jquery.fieldselection

Use and replace the text selected within a zone.

jquery.flip

Flip an element.

jquery.flot

Create graphs presenting data as curves, bars, etc.

jquery.highlight

Add syntax colorization.

jquery.hoverIntent

Add a prediction effect on JavaScript's hover event.

jquery.idTabs

Manage tabs.

jquery.ifxtransfer

Animate an element with a transfer from one container to another.

jquery.jqminmax

Add min-width, max-width, min-height and max-height on all browsers.

jquery.pngFix

Manage transparency in IE 5.5 and IE 6.

jquery.scrollTo

Make the page or element scroll to a certain position.

jquery.serialScroll

Make a series of element scroll to a certain position.

jquery.tablednd

Drag and drop a table's rows.

jquery.typewatch

Execute a function when the user has typed some text in a zone and has stopped typing after a certain amount of time.

jquery.validate-creditcard

Validate a credit card number depending on its type.

A couple of other

...

tools

jQuery's API is incredibly complete, and you will spend hours finding new possibilities.

...