JQuery UI

jQueryUI software
Logo
Genere	Libreria software (non in lista)
Sviluppatore	jQuery Project team
Data prima versione	17 settembre 2007
Ultima versione	1.13.3 (26 aprile 2024)
Sistema operativo	Multipiattaforma
Linguaggio	JavaScript
Licenza	licenza MIT (licenza libera)
Sito web	jqueryui.com/
Modifica dati su Wikidata · Manuale

jQuery UI è una libreria JavaScript ideata per uniformare e semplificare la gestione dell'Interfaccia grafica per pagine web interattive.^[1] È un'estensione della libreria jQuery ed è fruibile attraverso la medesima licenza libera, la MIT.^[2]

Caratteristiche

Le caratteristiche che seguono fanno riferimento alla versione 1.8.13.

jQueryUI è suddivisibile in quattro macro aree:

Interazioni (interactions): Parti dell'interazione con l'utente fra cui drag and drop, ridimensionamento, ordinamento e selezione;
Widget: Componenti grafici fra cui i selettori per l'inserimento di una data, calendari, ecc.
Effetti (effects): Effetti di transizione animati
Utilità (utilities): Utilità di basso livello usate dalle precedenti.

Nel dettaglio gli elementi di ogni macro area:

Interazioni

Parti relative all'interazione con la pagina web:

Draggable: Rende gli elementi trascinabili
Droppable: Verifica se un elemento è stato trascinato su un altro
Resizable: Rende gli elementi ridimensionabili
Selectable: Avanzate caratteristiche di selezione per liste di elementi
Sortable: Liste di elementi facilmente ordinabili

Widget

Parti relative a vari widget per l'interfaccia grafica:

Accordion: Contenitore "a fisarmonica"
Autocomplete: Auto completamento basato su ciò che l'utente digita
Button: Pulsante avanzato
Datepicker: Selettore avanzato di date
Dialog: Mostra una finestra di dialogo
Progressbar: Barra di avanzamento, con o senza animazione
Slider: Slider personalizzabile con varie funzionalità
Tabs: Interfaccia a schedario ("tabbed") con contenuti inline o a richiesta

Effetti

Parti relative a vari effetti grafici:

Color Animation: Animazione ottenuta con un passaggio da un colore a un altro
Toggle Class, Add Class, Remove Class, Switch Class: Animazione basata sul passaggio da uno style a un altro
Effect: Varietà di effetti (appear, slide-down, explode, fade-in, etc.)
Toggle: Commuta l'attivazione di un effetto
Hide', Show: Simile alla voce precedente

Utilità

Position: Imposta la posizione relativa di un elemento rispetto ad un altro

Compatibilità

Tutti i plugin sono testati ufficialmente per IE 6.0+, Mozilla Firefox 3+, Safari 3.1+, Opera 9.6+ e Google Chrome.^[3]

Alternative

Lo stesso argomento in dettaglio: HTML5, CSS, JavaScript e AJAX.

Con la nascita di HTML 5 e CSS 3 alcune possibilità come la creazione di gallerie d'immagini, effetti e menu a tendina sono fattibili senza l'utilizzo di JQuery UI e/o Ajax cosa che con HTML 4 e CSS 2 era spesso impossibile fare^[4]^[5]^[6]^[7].

Esempi di JQuery UI

Esempio di "Color picker" realizzabile in JQuery UI o HTML5
Esempio di widget realizzabile in JQuery UI o HTML5
Esempio di widget realizzabile in JQuery UI o CSS3

Note

^ (EN) jQuery UI, su stackoverflow.com. URL consultato l'8 gennaio 2017.
^ (EN) License (TXT), su github.com. URL consultato l'8 gennaio 2017.
^ (EN) Support, su jqueryui.com. URL consultato l'8 gennaio 2018.
^ (EN) 5 things you can do with CSS instead of JavaScript, su LogRocket Blog, 29 ottobre 2019. URL consultato il 9 febbraio 2021.
^ (EN) 49 CSS Galleries, su Free Frontend. URL consultato il 9 febbraio 2021.
^ LiveCode - HTML5 - Calculator App Demo, su livecode.com. URL consultato il 9 febbraio 2021.
^ Andrea Pacchiarotti, Menù responsivo in HTML e CSS senza JavaScript e jQuery, su Andrea pacchiarotti. URL consultato il 9 febbraio 2021.