„GridTab“ sukonfigūruokite reaguojančius langelius

Visada lengviau kurti svetaines naudojant atviro kodo įrankiai o ne išradinėti ratą. Šie įrankiai yra nuo bibliotekų iki mažesnių įskiepių, bet iš esmės galite rasti sprendimą.

Fenomenalus jQuery GridTab įskiepis yra vienas puikus pavyzdys. Tai leidžia jums sukurti tinklelį, apibrėžti lūžio taškus, ir sukurkite atsakingą skirtukų valdiklį kuri tinka bet kuriai svetainei.

Galite sukurti savo CSS klases arba dirbti su esamais, kad sukurtumėte skirtuką, kuris atitiktų jūsų dizainą. Šis papildinys taip pat palaiko navigacijos elementai kitam / ankstesniam valdymui ir perjungimas tarp skirtukų.

Įrengimas yra vėjas ir tam reikia tik jQuery biblioteka kaip priklausomybė. Įdiegę „GridTab“ galėsite patraukti iš „npm“ arba atsisiųsti jį tiesiogiai iš „GitHub“.

Atminkite, kad šio skirtuko valdiklio papildinys turi a numatytasis stilius, todėl ji turi atskira CSS stilių lentelė ant JS įskiepio failo. Tačiau visuomet galite sujungti šį CSS į savo, kad sumažintumėte HTTP užklausas.

Norėdami inicijuoti įskiepį, paprasčiausiai perduodate bendras tinklelio dydis kartu su bet koks neprivalomas parametras (visi išvardyti „GitHub“).

Štai paprastas inicijavimo scenarijus:

 $ (dokumentas). jau (funkcija () $ ('# gridtab-1'.) gridtab (grid: 3);); 

Nustatymai apima pasirinktiniai pasirinktuvai, jautrūs stiliai, sienos / poliravimo / spalvų nustatymai, ir, žinoma, a atgalinio ryšio funkcija.

Jums gali būti įdomu pamatyti, kaip visa tai veikia ir kokia atrodo jūsų naršyklėje. Patikrinkite “Demos” skyrių, kad pamatytumėte a keletas pavyzdžių, įskaitant žaliavinio kodo galite kopijuoti.

Dauguma žmonių galvoja apie skirtukus kaip mažų profilių valdiklių funkcijas. Tačiau, portfelio svetaines taip pat gali pasinaudoti tinklai su skirtukų funkcijomis ir „GridTab“ įskiepis yra geriausias šaltinis šiam efektui įterpti.

Viskas, ką reikia žinoti, įskaitant visą dokumentaciją, galima rasti pagrindiniame „GridTab“ puslapyje. Tai taip pat apima nuorodą į „GitHub“ repo, kad galėtumėte naršyti šaltinį ir pradėti pritaikyti savo reaguojančius skirtukų tinklus.