Tuoreet resurssit web-suunnittelijoille ja kehittäjille (kesäkuu 2015)
Voitko uskoa, että tämä sarja on ollut käynnissä lähes 3 vuotta? Tässä lyhyessä ajassa olemme esittäneet vähintään 30 luetteloa uusimmista resursseista web-suunnittelijoille ja kehittäjille. Ja aiomme pitää tämän menossa uuden kokoelman kesäkuussa.
Tässä kokoonpanossa tarkastelemme muutamia JavaScript-kirjastoja liukusäätimien näyttämiseen, tasaisempaan datataulukoiden selaamiseen, viileään hissin tehoon vierityspainiketta varten ja paljon muuta.
Tarkistetaan ne.
Keskitason tyyli Vahvista
Medium on saanut kiitosta sen suunnittelusta; ulkoasu ja käyttöliittymä näyttää ajatelevan perusteellisesti. Sen lisäksi se inspiroi myös web-kehittäjiä kehittämään joko JavaScript- tai CSS-kirjastoja UI: n kopioimiseksi. Keskikokoinen vahvistus on yksi JavaScript-kirjasto, joka muistuttaa ponnahdusikkunaa tai valintaikkunaa Mediumissa.
Pingviini
Penguin on uusi front-end-kehys, jota voit käyttää sivustojesi perustana. Gruntin ja Sassin kaltaisilla työkaluilla voit helposti lisätä tai poistaa kirjastoja tai CSS: ää, joita ei tarvita kehyksestä, jolloin se on mahdollisimman kevyt. Se on myös hyvä vaihtoehto Bootstrapille ja säätiölle.
Elevator.js
Oletko nähnyt kyseisen painikkeen verkkosivustossa, jonka avulla voit siirtyä sivun yläreunaan? Useimmat painikkeet vievät sinut alkuun, mutta Elevator.js: n avulla saat liukuvan kiihdytysvaikutuksen, joka on samanlainen kuin hissi, musiikki ja “ding!” äänen, kun olet saavuttanut ylimmän kerroksen. Todella kiva!
X-Instagram
X-Instagram on Polymer-mukautettu elementti, joka vetää ja näyttää kuvia Instagramista tunnisteella. Tämä elementti helpottaa koko prosessia. Lisää yksinkertaisesti elementti aivan kuten tavallinen HTML-elementti ja määrittele tunnisteen avainsana elementtimääritteiksi.
Ja anna taika alkaa!
CamanJS
CamanJS on suuri JavaScript-kirjasto kuvankäsittelyyn. Se sisältää ominaisuusjoukon, jonka löydät tavallisesti kuvankäsittelyohjelmassa. Voit kääntää kuvan epätarkkuutta, mustaa ja valkoista ja jopa lisätä kontrastia.
ClusterizeJS
Clusterize.js on JavaScript-kirjasto, joka lisää suorituskykyä käsitellessään paljon tietoja taulukoissa. Kun selaat taulukkoa, jossa on, esimerkiksi, 5000, luettelossa, kokemus muuttuu tavallisesti viiveeksi ja jerkiksi. Tämä JavaScript-kirjastot käsittelevät tätä ongelmaa, mikä tekee vieritystoiminnasta sujuvan purjehduksen aina.
Istu testi
Istu testi on joukko kysymyksiä, joiden avulla voit arvioida taitosi ja tietosi CSS3: sta, HTML5: stä ja JavaScriptista. Jokaiselle testille annetaan useita kysymyksiä ja rajoitettu aika näiden kysymysten täyttämiseksi. Se on hyvä lähde selvittää, kuinka hyvä olemme näillä kielillä.
HTML-nuolet
Tämä on kokoelma erityisiä natiivi-Unicode-symboleja, jotka voit upottaa HTML: ään ja CSS: ään. Näitä merkkejä ovat nuolet, valuutta ja välimerkit. Tulet huomaamaan, että joskus et tarvitse fonttikuvaketta näiden merkkien näyttämiseksi.
Flickity
Flickity on JavaScript-kirjasto, jolla voit näyttää verkkosivustosi karuselleja, gallerioita tai liukusäätimiä. Se on optimoitu kosketusnäytölle; voit siirtää karuselleja vaivattomasti sormella tai ohjauslevyllä, jos käytät kannettavaa tietokonetta. Siinä on myös joukko vaihtoehtoja, jotka mahdollistavat täydellisen räätälöinnin millä tahansa tavalla.
Typeslab
Typeslab on kätevä työkalu, jolla voidaan luoda levytyyppinen juliste. Kirjoita vain sisältö ja valitse fontti, Typeslab luo julisteen heti. Voit sitten ladata sen tai julkaista sen Imgurissa.
MatchMedia
Matchmedia on kirjasto, joka toistaa CSS-median kyselyt. Kirjasto ei ole todella tuore, mutta se on todella hyödyllinen kirjasto, jonka päätin laittaa luetteloon. Jos haluat tehdä komentosarjoja käyttäjän katseluportin koon tai mediatyypin perusteella, tämä on haluamasi kirjasto.
Seuraavassa on esimerkki, jota käytetään komentosarjan näyttämiseen 320x: n ja alle katseluympäristön koon:
jos (matchMedia ("vain näyttö ja (max-leveys: 320px)").) 
Sass Burger
Sass Burgerissa on Mixin, jonka avulla voit luoda a “Hampurilainen” kuvaketta ja muuta se ristikkäiseksi merkiksi, jossa on vähemmän vaivaa.
Marx
Marx on kokoelma CSS-tyylisääntöjä, jotta elementtityylit saadaan yhdenmukaisemmiksi. Se on muokattavissa (Sassin kanssa), kevyt ja toimii ulos laatikosta. Hyvä vaihtoehto jo suosituille CSS-palautustyökaluille, kuten Normalize.css.
CSS.js
CSS.js käytetään jäsentämään CSS-tiedostoja tyylitietojen ilmoittamista varten. Kirjastoa käytettiin alun perin Jotformin tiimissä WYSIWYG-kokemuksen luomiseen lomakkeiden muokkaamiseen CSS: llä. Nyt heillä on avoin lähde, jotta voimme käyttää sitä. Kannattaa säästää, jos tarvitset sitä myöhemmin.
