jQuery UI: Baixando e referenciando na página

Introdução

O jQuery UI é uma extensão da biblioteca javascript, que oferece uma série de controles, efeitos, validações e comportamentos para serem aplicados em componentes HTML.

Baixando

Entre na página http://jqueryui.com, clique em Download e em seguida em All jQuery UI Downloads.

Crie uma pasta e dentro dela baixe e desompacte os arquivos jQuery UI 1.12.1 (concatenated JS and CSS files) e jQuery UI 1.12.1 Themes.

Estes dois arquivos possuem exemplos e temas extras para que seja usado com o jQuery UI.

Referenciado

Precisamos montar uma pagina HTML simples, para organizar nossas referências no arquivo, e então adicionar nos locais corretos.

CSS e Temas

A referência para o arquivo jquery-ui.css deve estar entre as tags HEAD e preferencialmente logo abaixo da tag TITLE.

jQuery

Para que o jQuery UI funcione corretamente, ele depende que uma referência ao jQuery esteja localizada antes da sua chamada, todavia, referências de scripts ficam ao final da página, antes de fechar a tag BODY, na ordem de dependência.

jQuery UI

Logo após a referência do jQuery, é hora de chamar a biblioteca do jQuery UI.

Bloco de Script

Abaixo de todas as referências de arquivos js, é recomendado que se abra o bloco com os códigos javascript dentro da tag SCRIPT.

A página pronta

Veja este exemplo no GitHub:

https://github.com/tiagopariz/JQueryUIReference