Denne GitHub-side lister ikke-JS-alternativer til almindelige brugergrænsefladefunktioner
Hvor mange gange har du ønsket at bygg et hurtigt CSS-kun diasshow eller modal vindue? Disse er nogle af de mest almindelige brugergrænseelementer på nettet og i dag kan du bygge dem uden nogen JavaScript.
Sikker på, det er muligt at ramme Google på udkig efter løsninger. Men hvorfor ikke vælg fra en kureret liste af fantastiske ressourcer?
Det er her, hvor denne GitHub side kommer i spil. Det har titlen "Du behøver ikke JavaScript", og det giver en enorm liste over brugbare løsninger til fælles grænsefladeelementer.
En ting at bemærke er, at disse koder er ikke endelige løsninger.
Ikke alt i listen understøtter alle browsere, og mange af disse løsninger er ikke fuldt ud i stand til at håndtere grasiøs nedbrydning eller problemer med mobile browsere. Så det bliver du nødt til dyrlæge hver enkelt individuelt fra sag til sag.
Men hvis du dør for rene CSS-løsninger så har du denne GitHub dækket.
Listen indeholder over 20 forskellige UI elementer med mange fremtrædende løsninger, såsom:
- Hamburger menuer
- værktøjsvink
- Faner
- Billedgallerier
- Dropdown menuer
- Og så meget mere.
Hvert projekt linker ud til en CodePen demo hvor du kan se det live sammen med prøve kildekode.
Bemærk dette specifikke GitHub repo har ingen egentlig kode i det. Det er snarere bare en liste over CodePen demoer featuring Ikke-JS løsninger til fælles grænseflade problemer.
Dette er den perfekte ressource til bogmærke til fremtidig reference og holde tæt ved, hvis det er nødvendigt.
Du er gratis at bidrage ved at kontakte nogen fra vigtigste GitHub side hvis du har ideer eller forslag til nye ressourcer.
Du er fri til kopi enhver kildekode fra nogen af disse demoer og genbrug dem i dine projekter.
Bare sørg for det du kontrollerer CSS egenskaber fanen før du kopierer noget, fordi nogle indeholder ekstra biblioteker.
Alt i alt er dette et fantastisk GitHub repo, og det er meget nemmere at bruge end at skure Google for den ene perfekte løsning.
Tjek fuld GitHub side her, og hvis du vil se alle mulige ændringer du kan se dem i Træk anmodninger faneblad.