Using the basic JQuery Snippets

As well as the complete JQuery snippets in the UI Widget group there are also some basic snippets that need adding in combination.

In the General group we have snippets that link to the JQuery script files, either locally or on the Microsoft Ajax CDN (content delivery network). You might want to add your own snippets that link to the Google, Yahoo or other CDN. This group also has the 'Document ready' function used with JQuery.

Hint

When you save a page with a link to a CDN for the first time you'll get a dialog asking you to save the file locally. Click the 'Set Action' button and select 'Don't save'.

With the exception of the complete UI Widget snippets, you'll need to add the snippets for the link to the JQuery script file and the Document ready function before you use any of the other JQuery snippets.

Here they are added to a simple page. (Click the thumbnails to enlarge and close)

Now we can add one of the other snippets, for instance the 'Highlight input label'.

Note that there is a small error in this snippet: on the first line $("form:input") should read $("form :input) with a space after 'form'.

When you test your page, labels for form inputs (and only those in forms) will highlight when the input has focus, as below. (Click the input box).

Name:

Download this simple example