De 10 mest fascinerende jQuery-nettene
jQuery er vanligvis førstevalget for de fleste som ønsker å dyppe føttene i JavaScript-programmering, da det gir en enkel metode for å velge HTML-elementer og manipulere DOM. jQuery er veldig populær, ifølge den nyere statistikken til W3Techs, “jQuery brukes av 95,4% av alle nettstedene med JavaScript-biblioteket vi kjenner.”
jQuery brukes også av mange JavaScript-biblioteker som en avhengighet, og alfa-versjonen av den nye store versjonen, jQuery 3.0, er allerede der ute. Hvis prosjektet ditt bruker jQuery på noen måte, og du vil ha en dynamisk, fleksibelt layout for designen din er det verdt å vurdere å inkludere et jQuery-grid-plugin i frontend-stakken.
Hvordan jobber jQuery Grids?
jQuery-nett gir deg det opprett Pinterest-lignende layouter for nettstedet ditt. De fungerer som en virtuell matrise, de følger “boks inne i en boks” prinsipp. jQuery-nettene beregner dynamisk hva som er det beste arrangementet av elementer og fylle siden med dem på en måte som etterlater minst tomt plass, noe som det du ser i disse boksene her.
Den største fordelen med jQuery-nett sammenlignet med CSS-nett er at de jobber med bilder eller andre medieelementer som har forskjellige bredder og høyder. Cool JavaScript-effekter er også en stor grunn til å bruke jQuery-nett for å skape et moderne layout.
I dette innlegget kan du lese om 10 mest fascinerende jQuery-nett som for tiden er ute på markedet - selvfølgelig, akkurat som jQuery, alle er åpen og gratis.
1. jQuery Nested
jQuery Nested gir deg en hendig multi-column grid layout som er responsiv og fungerer over alle typer enheter. Denne jQuery-plugin annonserer seg selv som helt gapfri. I begynnelsen kan dette slagordet høres ut som et billig markedsføringstrykk, men pluggen utfører faktisk gapfrihet veldig pent, akkurat som dets skapere lovet.
jQuery Nested følger et unikt skript i fylle gridmatrisen. Først skaper det et multikolonnettet, så skanner det matrisen for hull og fyller dem ved å omorganisere de forskjellige elementene. Endelig - og det er trinnet som gjør dette rutenettet ufordelaktig - det endrer ethvert element i den nederste raden som ikke passer riktig inn i gapet.
2. Freewall
Freewall lar deg lage oppsettet du vil ha, om det er et billedgitter, et nestet rutenett, et murverk eller et metrostativrutenett. Den har mange alternativer som du kan angi som JavaScript-variabler som gutterX, gutterY, animere, cellW, cellH, etc. Det har tilpassede arrangementer som onGapFound og onResize, og tilpassede metoder også.
Du kan finne fine kodeksempler på deres hjemmeside. The devs bryr seg også om de fattige sjeler som fortsatt må designe for eldre nettlesere, så Freewall støtter Internet Explorer 8, og den har også a løsning for deaktivert JavaScript, som det bruker CSS 3 animasjoner som en JS fallback strategi. Sjekk ut vår artikkel på Freewall her.
3. Murverk
Navnet på den gode gamle murverket må være kjent for ørene til alle erfarne designere. Hvis du ikke har hørt om det, er Masonry a cascading grid layout bibliotek som fungerer med både jQuery og vanilla JavaScript.
Denne praktiske plugin er grunnlaget for mange populære WordPress-temaer. Du trenger ikke en gang å laste den opp til serveren din, da du enkelt kan koble biblioteket direkte fra en CDN.
>
