Video: Creo un SITO WEB (da Zero) #03 ⋆ JAVASCRIPT 2024
Scrivere il codice dell'interfaccia utente jQuery non è difficile, ma ottenere le parti giuste della libreria può essere un po 'di confusione per i programmatori HTML5 e CSS3. La libreria dell'interfaccia utente di jQuery è molto più grande del pacchetto jQuery standard, quindi potresti non voler includere l'intera cosa se non ne hai bisogno.
Le versioni precedenti dell'interfaccia utente di jQuery ti consentivano di scaricare l'intero pacchetto ma di memorizzare ciascuno dei vari elementi in un file JavaScript separato. Era comune avere una mezza dozzina di tag script diversi attivi solo per ottenere i vari elementi sul posto.
Peggio ancora, esistevano alcuni problemi di dipendenza, quindi era necessario assicurarsi che alcuni pacchetti fossero installati prima di usare altri pacchetti. Ciò ha reso una libreria semplice abbastanza complessa da utilizzare effettivamente.
Fortunatamente, le ultime versioni dell'interfaccia utente di jQuery rendono questo processo un po 'più semplice:
-
Scegli (o crea) il tuo tema.
Usa il sito themeRoller per scegliere un punto di partenza dalla libreria dei modelli. È quindi possibile personalizzare il tema esattamente per fare quello che vuoi (cambiando colori, caratteri e altri elementi).
-
Scarica il tema.
Il temaRoller ha un pulsante di download. Fai clic quando sei pronto per scaricare il tema.
-
Scegli gli elementi che desideri.
Quando inizi per la prima volta su un progetto, probabilmente sceglierai tutti gli elementi. Se trovi che la pagina si sta caricando troppo lentamente, potresti creare una versione più piccola che contiene solo quegli elementi di cui hai bisogno. Per ora, scegli tutto.
-
Scarica il file.
Dopo aver scelto gli elementi che desideri, puoi scaricarli in un file zip.
-
Installa il contenuto del file zip nella tua directory di lavoro.
Il file zip contiene un numero di file e directory. Copia le directory css e js nella directory in cui si trovano le tue pagine web (spesso la directory public_html o htdocs). Non è necessario copiare la directory del bundle di sviluppo o l'indice. pagina HTML.
-
Se installi più temi, copia solo le informazioni sul tema da temi aggiuntivi.
Tutti i temi utilizzano lo stesso JavaScript. Cambia solo il CSS (e i relativi file di immagine). Se vuoi avere più temi nel tuo progetto, copia semplicemente i contenuti CSS. Ogni tema sarà una sottodirectory diversa della directory CSS principale.
-
Collegamento ai file CSS.
Usa la tecnica di collegamento standard per collegarti ai file CSS creati dall'interfaccia utente di jQuery. Puoi anche collegare i tuoi file CSS o utilizzare CSS interno oltre al CSS personalizzato. Assicurati di avere il percorso giusto.
-
Collegamento ai file JavaScript.
Il toolkit jQuery UI installa anche due file JavaScript: la libreria jQuery standard e la libreria UI jQuery. Per impostazione predefinita, entrambi questi file sono installati nella directory js. Dovrai collegarti a entrambi i file. A volte vedrai file minimizzati accanto alle versioni ordinarie. La versione ridotta avrà il termine min incorporato. Una delle due versioni va bene, ma la versione ridotta a icona verrà caricata più velocemente.
Se qualcosa non funziona correttamente, controlla di nuovo i percorsi dei file. Quasi sempre, i problemi sorgono perché non hai collegato a tutti i file giusti. Inoltre, tieni presente che i file CSS creati dall'interfaccia utente di jQuery includono anche immagini. Assicurati che il tuo tema abbia una cartella immagini associata, altrimenti il tuo progetto potrebbe non funzionare correttamente. Se hai copiato tutte le directory CSS e JS dal download, dovresti stare bene.
