Deze GitHub-pagina bevat niet-JS-alternatieven voor algemene gebruikersinterface-functies

Hoe vaak heb je dat willen doen? bouw een snelle CSS-only slideshow of modaal venster? Dit zijn enkele van de meest voorkomende gebruikersinterface-elementen op internet en tegenwoordig kun je ze zonder JavaScript bouwen.

Natuurlijk is het mogelijk om op Google te zoeken naar oplossingen. Maar waarom niet kies uit een samengestelde lijst van geweldige bronnen?

Dat is waar deze GitHub-pagina in het spel komt. Het is getiteld "U heeft geen JavaScript nodig", en het biedt een enorme lijst van bruikbare oplossingen voor gemeenschappelijke interface-elementen.

Een ding om op te merken is dat deze codes zijn niet alles-bij-alles-oplossingen.

Niet alles in de lijst ondersteunt alle browsers en veel van deze oplossingen zijn niet volledig in staat om gracieuze verslechtering of problemen met mobiele browsers op te lossen. Dat moet je dus doen behandel ze allemaal afzonderlijk van geval tot geval.

Maar als je wilt sterven pure CSS-oplossingen dan heeft deze GitHub je gedekt.

De lijst is voorbij 20 verschillende gebruikersinterface-elementen met veel prominente oplossingen, zoals:

• Hamburger-menu's
• tooltips
• tabs
• Afbeeldingengalerijen
• Dropdown-menu's
• En zoveel meer.

Elk project koppelingen naar een CodePen-demo waar je kan zie het live samen met voorbeeld broncode.

Let op deze specifieke GitHub repo heeft geen echte code in het. Nee, het is gewoon een lijst met CodePen-demo's featuring niet-JS-oplossingen voor algemene interfaceproblemen.

Dit is het perfecte hulpmiddel om een ​​bladwijzer te maken voor toekomstig gebruik en indien nodig in de buurt te houden.

Je bent vrij om een ​​bijdrage te leveren door contact op te nemen met iemand van de hoofdpagina GitHub als je ideeën of suggesties hebt voor nieuwe bronnen.

Je bent vrij om te doen kopieer een broncode van een van deze demo's en hergebruik ze in uw projecten.

Zorg er gewoon voor dat u vinkt het tabblad CSS-eigenschappen aan voordat je iets kopieert, omdat sommige bevatten extra bibliotheken.

Over het algemeen is dit een fantastische GitHub-repo en het is veel gemakkelijker om Google te gebruiken voor die ene perfecte oplossing.

Controleer de volledige GitHub-pagina hier, en als je dat wilt bekijk alle mogelijke veranderingen je kunt die zien in de pull-requests tabblad.