Cursos / Informática para Internet / Desenvolvimento Web II / Aula

arrow_back Aula 09 - jQuery (Parte 3)

Widgets

Nos estudos desta aula, iremos focar nos componentes visuais (widgets) do jQuery UI. Note que jQuery UI não se restringe a componentes visuais. Como dito no início desta aula, o jQuery UI também contempla efeitos e interações.

A tabela a seguir apresenta os principais componentes e suas descrições.

Widget Descrição
Accordion Menu onde cada item possui um corpo oculto (uma div) que é exibido quando o item é clicado.
Autocomplete Campo texto que, baseado no que o usuário for digitando, filtra e sugere opções para autocompletar o texto que está sendo inserido.
Button Componente para transformar o visual de diversos elementos (campos checkbox, radio, links etc.) do HTML padrão em botão.
Datepicker Calendário para seleção de datas.
Dialog Diversos tipos de diálogos (janelas) exibidos sobre a página corrente.
Progressbar Barra de progresso.
Slider Barra de indicação de valor que permite interação com o usuário (Ex.: poderia ser utilizada para controlar o volume de um tocador de música).
Tabs Permite agrupar contêineres (div) em abas.
Tabela 1 - Descrição dos principais componentes (widgets) do jQuery UI.

Como veremos a seguir, trabalhar com jQuery UI é bastante simples e intuitivo.

  • Todos os componentes são representados por meio de elementos disponíveis na própria linguagem HTML.
  • Através de funções disponíveis na jQuery UI, informamos a ela quais elementos devem ser tratados como componentes jQuery UI (ao invés de puro elementos HTML).
  • Todas as funções da jQuery UI que veremos a seguir aceitam como argumento dentro de chaves ({}) um array de propriedade a depender do método em questão.

Versão 5.3 - Todos os Direitos reservados