Hur man hämtar jQuery-användarbiblioteket för HTML5 och CSS3-programmering - dummies

Skriva jQuery UI-kod är inte svårt, men att få rätt delar av biblioteket kan vara lite förvirrande för HTML5- och CSS3-programmerare. Biblioteket jQuery UI är mycket större än standard jQuery-paketet, så du kanske inte vill inkludera hela saken om du inte behöver det.

Tidigare versioner av jQuery-användargränssnittet låter dig hämta hela paketet men lagrade varje av de olika elementen i en separat JavaScript-fil. Det var vanligt att ha ett halvt dussin olika skript taggar aktiva bara för att få de olika elementen på plats.

Värre, det fanns vissa problem med beroende, så du måste se till att du hade vissa paket installerade innan du använde andra paket. Detta gjorde ett enkelt bibliotek ganska komplicerat att faktiskt använda.

Lyckligtvis gör de senaste versionerna av jQuery UI denna process ganska enklare:

1. Välj (eller skapa) ditt tema.

   Använd themeRoller-webbplatsen för att välja en startplats från mallbiblioteket. Du kan sedan anpassa ditt tema exakt för att göra vad du vill (ändra färger, teckensnitt och andra element).

2. Ladda ner temat.

   ThemeRoller har en nedladdningsknapp. Klicka här när du är redo att ladda ner ditt tema.

3. Välj de element du vill ha.

   När du börjar med ett projekt, kommer du noga att välja alla element. Om du upptäcker att sidan laddas för långsamt kan du bygga en mindre version som bara innehåller de element du behöver. För nu, plocka allt.

4. Hämta filen.

   När du har valt de element du vill ha kan du hämta dem i en zip-fil.

5. Installera innehållet i zip-filen till din arbetsregister.

   Zip-filen innehåller ett antal filer och kataloger. Kopiera css och js kataloger till katalogen där dina webbsidor kommer att vara (ofta public_html eller htdocs katalogen). Du behöver inte kopiera utvecklingsbuntkatalogen eller indexet. html-sida.

6. Om du installerar flera teman kopierar du bara temainformationen från ytterligare teman.

   Alla teman använder samma JavaScript. Endast CSS (och relaterade bildfiler) ändras. Om du vill ha flera teman i ditt projekt, kopierar du bara CSS-innehållet. Varje tema kommer att vara en annan underkatalog i huvudkatalogen för CSS.

7. Länk till CSS-filerna.

   Använd standardlänktekniken för att länka till CSS-filer som skapats av jQuery UI. Du kan också länka till dina egna CSS-filer eller använda intern CSS förutom anpassad CSS. Var säker på att du får vägen till höger.

8. Länk till JavaScript-filerna.

   JQuery UI-verktygsverktyget installerar också två JavaScript-filer: Standard jQuery-biblioteket och jQuery UI-biblioteket. Som standard installeras båda dessa filer i js-katalogen. Du måste länka till båda filerna. Ibland ser du minimerade filer tillsammans med vanliga versioner. Den minimerade versionen kommer att ha termen min inbäddad. Antingen är versionen bra, men den minimerade versionen laddas snabbare.

Om något inte fungerar rätt, kontrollera dina filvägar igen. Nästan alltid uppstår problem eftersom du inte har länkat till alla rätt filer. Observera också att CSS-filer som skapats av jQuery UI också innehåller bilder. Se till att ditt tema har en associerad bildkatalog eller att ditt projekt kanske inte fungerar korrekt. Om du kopierade hela CSS och JS katalogerna från nedladdningen, borde du ha det bra.