Creëer Easy Sliding Hamburger-menu's met jQuery Slidebars Framework

UX-ontwerpers kibbelen over het gebruik van hamburger menu's in webontwerp. Ze dienen een doel voor mobiele gebruikers maar ook hebben een lagere vindbaarheid.

Ik kan niet zeggen of ze het waard zijn om te gebruiken op uw website of niet, maar als u op zoek bent naar een gemakkelijke manier om een glijdend menu instellen dan de Slidebars Framework is een handige hulpbron.

Slidebars is volledig gratis en open-source, gebouwd op de top van de jQuery-bibliotheek. Het werkt net zoals je zou verwachten wanneer je op een hamburgersymbool klikt om een ​​schuifmenu te openen duwt het scherm van canvas plaats maken.

Een eigenschap die ik vooral leuk vind, is de tik om de instellingen te verbergen waar je overal op de pagina naartoe kunt tikken verberg onmiddellijk het menu. Dit is niet in elke schuifmenuplug-in ingebouwd, maar het is een functie die de gebruikerservaring aanzienlijk verbetert.

Deze plug-in is volledig open source en de code is gratis beschikbaar op GitHub als je wilt rondneuzen. De repo mist echter een duidelijke set documentatie die het instellen moeilijker maakt.

Gelukkig kun je dit vinden op de hoofdsite met volledige gebruiksaanwijzingen om Slidebars snel op en neer te laten gaan.

Het ondersteunt schuifmenu's van alle vier zijden van het scherm, samen met aangepaste functies voor animatie-effecten, kleurkeuzes en totale breedte / hoogte van het menu.

Het hele glijdende menu werkt op een off-page-element, dus je moet het doen stel het menu buiten het canvas juist in. Dit omvat zowel de juiste HTML als de juiste CSS voor styling.

Dit alles is uitvoerig beschreven in de documentatie, dus als je de pagina's stap voor stap volgt, zou je het goed moeten laten werken. En, de standaardinstelling vereist geen aangepaste eigenschappen, dus als je gewoon de basisstappen volgt, heb je geen problemen.

Slidebars is echt een volledig kader en het heeft zelfs een aangepaste API je kunt werken. Hiermee kunt u bel jQuery-functies om functies toe te voegen of standaardfuncties aan te passen. Een uitstekende keuze voor ontwikkelaars die een glijdend menu nodig hebben, maar er geen één willen creëren.

Als je meer wilt weten, kijk dan eens op de Slidebars-website. Het heeft letterlijk alles wat je moet weten en genoeg demo's om rond te gaan.