Nauji ištekliai žiniatinklio dizaineriams ir kūrėjams (2015 m. Birželio mėn.)
Ar galite manyti, kad ši serija veikia beveik 3 metus? Per trumpą laiką pristatėme bent 30 naujausių žiniatinklio dizainerių ir kūrėjų išteklių. Ir mes ketiname išlaikyti šį procesą su nauju birželio mėnesio rinkiniu.
Šiame rinkinyje mes peržiūrėsime keletą „JavaScript“ bibliotekų, rodančių slankiklius, sklandesnį duomenų lentelių slinkimą, atvėsti efektą slinkties į viršų mygtukui ir dar daugiau.
Patikrinkime juos.
Vidutinio stiliaus patvirtinimas
Mediumas buvo giriamas už jo dizainą; atrodo, kad išdėstymas ir UI buvo gerai apgalvotos. Be to, ji taip pat įkvepia žiniatinklio kūrėjus kurti „JavaScript“ arba „CSS“ bibliotekas, kad galėtų pakartoti UI. Vidutinio stiliaus patvirtinimas - tai viena „JavaScript“ biblioteka, panaši į iššokantįjį langą arba dialogo langą „Medium“.
Pingvinas
„Penguin“ yra nauja „front-end“ sistema, kurią galite naudoti kaip savo svetainių pagrindą. Naudodamiesi tokiais įrankiais kaip „Grunt“ ir „Sass“, galite lengvai pridėti arba pašalinti bibliotekas ar CSS, kurių nereikia iš sistemos, kad jis būtų kuo lengvesnis. Tai taip pat gera alternatyva „Bootstrap“ ir „Foundation“.
Elevator.js
Ar matėte tą mygtuką svetainėje, leidžiančioje jums nusileisti į puslapio viršų? Dauguma mygtukų tiesiog nuveda jus į viršų, tačiau su „Elevator.js“ jūs gaunate slankiąją pagreičio efektą, panašų į liftą, muziką ir “Ding!” pasieksite aukščiausią aukštą. Tikrai gražus!
X-Instagram
„X-Instagram“ yra polimero pasirinktinis elementas, kuris traukia ir rodo nuotraukas iš Instagram pagal žymę. Šis elementas palengvina visą procesą. Paprastai elementą pridedame kaip įprastą HTML elementą ir nurodykite žymos raktinį žodį kaip elemento atributus.
Ir tegul prasideda magija!
CamanJS
CamanJS yra puiki „JavaScript“ biblioteka vaizdų manipuliavimui. Jame yra funkcijų rinkinys, kurį paprastai rasite vaizdo redaktoriuje. Galite pasukti vaizdo neryškumą, juodą ir baltą ir net padidinti kontrastą.
ClusterizeJS
„Clusterize.js“ yra „JavaScript“ biblioteka, kuri padidins našumą sprendžiant daug duomenų lentelėse. Slenkant žemyn stalą su, pvz., 5000, sąraše, paprastai patirtis taps laggy ir jerky. Ši „JavaScript“ bibliotekos spręs šią problemą, todėl slinkimo veiksmas sklandžiai plaukioja visą kelią.
Sėdėkite testą
Sėdėkite testą yra klausimų rinkinys, skirtas įvertinti savo įgūdžius ir žinias apie CSS3, HTML5 ir „JavaScript“. Kiekvienam bandymui pateikiami keli klausimai ir ribotas laikas šiems klausimams įvykdyti. Tai geras šaltinis, kad sužinotume, kaip gerai mes turime šias kalbas.
HTML rodyklės
Tai yra specialiųjų vietinių Unicode simbolių, kuriuos galite įdėti į HTML ir CSS, rinkinys. Šie simboliai apima rodykles, valiutą ir skyrybos ženklus. Jūs pastebėsite, kad kartais nereikia šrifto piktogramos, kad būtų rodomi šie simboliai.
Flickity
„Flickity“ yra „JavaScript“ biblioteka, rodanti karuselius, galerijas ar slankiklius jūsų svetainėje. Jis yra optimizuotas jutikliniam ekranui; jūs galite stumti karuselius be pertraukos pirštu arba klaviatūra, jei esate nešiojamuoju kompiuteriu. Jame taip pat yra daugybė parinkčių, leidžiančių pilnai pritaikyti bet kokiu būdu.
Typeslab
Typeslab yra patogus įrankis, skirtas sukurti plokštės tipo plakatą. Tiesiog parašykite turinį ir pasirinkite šriftą, „Typeslab“ iškart generuos plakatą. Tada galite jį atsisiųsti arba publikuoti „Imgur“.
MatchMedia
Matchmedia yra biblioteka, kuri pakartoja CSS žiniasklaidos užklausas. Biblioteka iš tikrųjų nėra tokia šviežia, bet tai tikrai naudinga biblioteka, kurią nusprendžiau įtraukti į sąrašą. Jei reikia atlikti scenarijus pagal naudotojo peržiūros srities dydį arba laikmenos tipą, tai yra norima biblioteka.
Toliau pateikiamas pavyzdys, naudojamas paleisti scenarijų 320 pikselių ir žemiau peržiūros srities dydžio:
jei (matchMedia („tik ekranas ir (maksimalus plotis: 320px)“).)
Sass Burger
„Sass Burger“ ateina su „Mixin“, kuri leidžia jums sukurti a “Hamburgeris” piktogramą ir paversti jį kryžminiu ženklu, kuriame yra mažiau problemų.
Marxas
„Marx“ yra CSS stiliaus taisyklių rinkinys, kad elementų stiliai būtų nuoseklesni. Jis yra pritaikomas (su „Sass“), lengvas ir veikia iš dėžutės. Gera alternatyva jau populiariems CSS reset įrankiams, pvz., Normalize.css.
CSS.js
CSS.js naudojamas analizuoti CSS failus stiliaus deklaravimui. Iš pradžių biblioteka buvo naudojama „Team“ komandai, kad sukurtų WYSIWYG patirtį formų redagavimui su CSS. Dabar jie yra atviri, kad galėtume juos naudoti. Verta taupyti, tik tuo atveju, jei jums to reikia vėliau.
