Hvordan du laster ned jQuery UI-biblioteket for HTML5 og CSS3 Programmering - dummies

Skriving av jQuery UI-kode er ikke vanskelig, men å få de riktige delene av biblioteket kan være litt forvirrende for HTML5- og CSS3-programmerere. Biblioteket for jQuery UI er mye større enn standard jQuery-pakken, så du vil kanskje ikke inkludere det hele hvis du ikke trenger det.

Tidligere versjoner av jQuery brukergrensesnittet tillot deg å laste ned hele pakken, men lagret hver av de forskjellige elementene i en egen JavaScript-fil. Det var vanlig å ha et halvt dusin forskjellige skriptkoder aktive bare for å få de forskjellige elementene på plass.

Verre, noen avhengighetsproblemer eksisterte, så du måtte sørge for at du hadde visse pakker installert før du brukte andre pakker. Dette gjorde et enkelt bibliotek ganske komplisert å faktisk bruke.

Heldigvis gjør de siste versjonene av jQuery-brukergrensesnittet denne prosessen ganske enklere:

1. Velg (eller opprett) temaet ditt.

   Bruk themeRoller-siden til å velge et startsted fra malbiblioteket. Du kan deretter tilpasse temaet nøyaktig for å gjøre hva du vil (endre farger, skrifter og andre elementer).

2. Last ned temaet.

   ThemeRoller har en nedlastningsknapp. Klikk på dette når du er klar til å laste ned temaet ditt.

3. Velg elementene du vil ha.

   Når du først starter med et prosjekt, vil du sannsynligvis velge alle elementene. Hvis du finner at siden lastes for sakte, kan du bygge en mindre versjon som bare inneholder de elementene du trenger. For nå, velg alt.

4. Last ned filen.

   Etter at du har valgt elementene du vil, kan du laste dem ned i en zip-fil.

5. Installer innholdet i zip-filen i arbeidskatalogen.

   Zip-filen inneholder et antall filer og kataloger. Kopier css og js katalogene til katalogen hvor websidene dine vil være (ofte public_html eller htdocs katalogen). Du trenger ikke å kopiere utviklingspakken eller indeksen. html side.

6. Hvis du installerer flere temaer, kopier du bare temainformasjonen fra flere temaer.

   Alle temaer bruker samme JavaScript. Bare CSS (og tilhørende bildefiler) endres. Hvis du vil ha flere temaer i prosjektet, kopier du bare CSS-innholdet. Hvert tema vil være en annen underkatalog i hovedkatalogen for CSS.

7. Link til CSS-filene.

   Bruk standardkoblingsteknikken til å koble til CSS-filene som er opprettet av jQuery UI. Du kan også koble til dine egne CSS-filer eller bruke intern CSS i tillegg til egendefinert CSS. Pass på at du får banen til høyre.

8. Koble til JavaScript-filene.

   JQuery UI toolkit installerer også to JavaScript-filer: Standard jQuery-biblioteket og jQuery UI-biblioteket. Som standard er begge disse filene installert i js-katalogen. Du må koble til begge filene. Noen ganger ser du minimerte filer sammen med vanlige versjoner. Den minimerte versjonen vil ha termen min innebygd. Enten versjonen er greit, men den minimerte versjonen lastes raskere.

Hvis noe ikke fungerer riktig, må du sjekke filbanene dine igjen. Nesten alltid oppstår det problemer fordi du ikke har koblet til alle de riktige filene. Vær også oppmerksom på at CSS-filene som er opprettet av jQuery UI, også inneholder bilder. Pass på at temaet ditt har en tilhørende bildekatalog, eller at prosjektet ditt kanskje ikke fungerer riktig. Hvis du kopierte hele CSS og JS katalogene fra nedlastingen, bør du ha det bra.