nl.hideout-lastation.com
Paradijs Voor Ontwerpers En Ontwikkelaars


Maak aangepaste responsieve voortgangsbalken met ProgressBar.js

Voortgangsbalken zijn bij de meeste gebruikers op internet algemeen bekend. Voor ontwikkelaars is het vaak een ingewikkeld proces om vanuit het niets een voortgangsbalk te maken . Maar met ProgressBar.js hoeft dat niet!

Deze gratis open-sourcebibliotheek heeft geen afhankelijkheden en ondersteunt alle belangrijke browsers, inclusief IE9 +.

Standaard kunt u een eenvoudige balk gebruiken, of u kunt kiezen uit een paar basisvormen, zoals:

  • Enkele lijn
  • Halve cirkel
  • Volledige cirkel
  • Plein
  • Driehoek

U kunt ook uw eigen aangepaste vormen ontwerpen, zoals een hart, een wolk, of zelfs de belettering van het logo van uw website. Toegegeven dit kost wat moeite, maar het eindresultaat kan ongelooflijk zijn.

De bibliotheek werkt op SVG-paden, dus als u een geschetste vorm kunt maken met SVG-markeringen, kunt u deze animeren met deze voortgangsbalkbibliotheek.

Animaties kunnen ook tekst bevatten of aangepaste start / stop-patronen hebben . De volledige API heeft meer details met opties / callbacks die u op uw gemak kunt bekijken.

ProgressBar.js heeft ook een kleine installatiegids waar je het script kunt downloaden en instellen met behulp van Bower, npm of de meer vereenvoudigde GitHub-pagina.

En als je iets cools bouwt, kun je je code in de GitHub-repo indienen . De maker van het project, Kimmo Brunfeldt, heeft een open GitHub-probleem waarbij je aangepaste ontwerpen kunt indienen om in de bibliotheek te kunnen opnemen.

U kunt geanimeerde voortgangsbalkjes toevoegen aan aanmeldingspagina's, velden uploaden of naar een webpagina als preloader. De opties worden alleen beperkt door hoe gedetailleerd je bereid bent om te krijgen.

Ik hou bijvoorbeeld van de demo van de wachtwoordsterktemeter, omdat deze een echt doel dient en de gebruikerservaring ten goede komt . Dit exemplaar wordt geleverd bij de plug-in, dus u kunt dit kopiëren en naar wens aanpassen.

Ga voor meer voorbeelden naar de startpagina van ProgressBar.js of neem een ​​kijkje bij deze viool om de hartanimatie te demonstreren.

Nanoreset - de kleinste CSS-reset met een gewicht van minder dan 1 KB

Nanoreset - de kleinste CSS-reset met een gewicht van minder dan 1 KB

De meeste ontwikkelaars zouden nooit een site helemaal vanaf nul willen bouwen. Dit laat twee opties over: werk met een frontend raamwerk of gebruik een aangepaste reset.De meest populaire reset is Normalize, die alle standaard standaardstijlen van de browser opmaakt, waardoor het eenvoudiger wordt om de consistentie tussen verschillende OS 'en browsers te behouden

(Technische en ontwerptips)

15 games en apps om het maximale uit iMessages in iOS 10 te halen

15 games en apps om het maximale uit iMessages in iOS 10 te halen

iOS-gebruikers kunnen nu meer doen met berichten dan ooit tevoren, besprekingen met stickers van hun favoriete stripfiguur spatten, effecten gebruiken, spelletjes spelen en zelfs evenementen plannen of tafels reserveren op de aanbevolen plaatsen om te eten.Hier zijn enkele van de apps en games die je kunt gebruiken en spelen in Berichten met je mede-iOS-vrienden

(Technische en ontwerptips)