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
1 2 3 4 5 6 7 8 9 10 11 12 13 14 15 16 17 18 19 20 21 |
<!DOCTYPE html> <html> <head> <title>JQuery: References</title> <link href="jquery-ui-1.12.1/jquery-ui.css" rel="stylesheet"> </head> <body> <script src="jquery-ui-1.12.1/external/jquery/jquery.js"></script> <script src="jquery-ui-1.12.1/jquery-ui.js"></script> <script> // Bloco de javascript </script> </body> </html> |
Veja este exemplo no GitHub: