Använda jQuery för att juicera upp en vanlig webbsida

jquery

JavaScript är inte det enklaste av språk att lära sig. Många webbutvecklare som förstår standard HTML är ganska skrämda av den. En ny typ av JavaScript-ramar har funnits ett tag nu och börjar slå på nätet i steg.

Alla moderna webbläsare kan köra JavaScript effektivt (några senaste ändringar av firefox har verkligen påskyndat sin motor, dock). Jag rekommenderar starkt att du laddar ner och använder Firefox - the insticksmoduler ensam gör det ovärderligt.

jQuery är ett JavaScript-ramverk som jag har experimenterat mer och mer med nyligen. När jag satte upp en platshållare för en ny start hade vi inte tillräckligt med innehåll för en fullständig webbplats men vi ville skapa en trevlig sida som beskrev vad som skulle komma. Och vi ville göra det på några minuter!

jQuery gjorde precis tricket.

Gör en sökning efter jQuery + nästan vad som helst, och du kommer också att upptäcka att utvecklare har byggt lösningar, så kallade plugins, som är redo att gå! I det här fallet sökte jag efter “jQuery-karusell” och fann en fantastisk, omfattande jQuery-karusellösning på Dynamic Drive.

En annan trevlig sak med jQuery är att det är koden är nu värd för Google. Som ett resultat behöver du inte ladda upp jQuery till din egen server, och inte heller behöver webbplatsens läsare ladda ner den varje gång. Om de har varit på en webbplats med hänvisning till jQuery cachas den automatiskt för användning på din webbplats!

Lägg bara till koden i din huvudtagg så är du igång med jQuery:


För att köra karusellen var jag tvungen att ladda upp och referera till stepcarousel-skriptet:


Efter det var det enkelt att ändra sidan! Jag lägger min karusell i en div kallad mygallery och remsan av paneler inom en div kallad bälte. Jag lade sedan till en liten bit med inställningskod i min kroppstagg.

Du kan anpassa åtgärden ganska mycket. I det här fallet ändrade jag skriptet så att det körs automatiskt när sidan laddas. Jag anpassade hastigheten och varaktigheten som varje panel visas, samt knapparna för att manuellt rotera panelerna åt vänster och höger. En annan cool funktion i detta plugin - när du kommer till den sista panelen, det spolar tillbaka tillbaka till det första!

Om du är rädd för programmering eller JavaScript är skrämmande kan jQuery vara lösningen för dig. För det mesta behöver du helt enkelt kopiera och klistra in filreferenser, redigera några inställningar, strukturera sidan korrekt ... och du är igång.

3 Kommentarer

  1. 1

    Jag bygger för närvarande min webbplats och siktar på en lansering i helgen om allt går bra. Jag använder jQuery för några aspekter av det och har inga klagomål hittills. Allt verkar ge av sig den "web 2.0" -känslan och förhoppningsvis kommer den bara att komplettera den färdiga webbplatsen.

Vad tror du?

Den här sidan använder Akismet för att minska spam. Läs om hur din kommentardata behandlas.