To get started with the jQuery UI library, you'll need to add the jQuery script, the jQuery UI script, and the jQuery UI stylesheet to your HTML.
First, download jQuery UI; choose the features you need on the download page. Unzip your download, and put jquery-ui.css
and jquery-ui.js
(and jquery.js
) in a folder where you can use them from your HTML (e.g. with your other scripts and stylesheets.)
jQuery UI depends on jQuery, so remember to include jquery.js
before jquery-ui.js
.
<link rel="stylesheet" href="stylesheets/jquery-ui.css">
<script src="scripts/jquery.js"></script>
<script src="scripts/jquery-ui.js"></script>
That's it! You can now use jQuery UI. For example, use the datepicker with the following HTML:
<input type="text" name="date" id="date">
Then use the following JavaScript:
$("#date").datepicker();
Which will get you a nice datepicker popup:
For more, see the official "Getting started" gude.