Opret Easy Sliding Hamburger Menuer med jQuery Slidebars Framework

UX designere bicker over brugen af hamburger menuer i webdesign. De tjene et formål for mobile brugere men også har lavere opdagelighed.

Jeg kan ikke sige, om de er værd at bruge på din hjemmeside eller ej, men hvis du leder efter en nem måde at oprette en glidende menu så den Slidebars Framework er en praktisk ressource.

Slidebars er helt gratis og open source, bygget oven på jQuery-biblioteket. Det fungerer ligesom du ville forvente, hvor du klikker på et hamburgerikon for at åbne en glidende menu og den skubber skærmen off-canvas at gøre plads.

Én funktion jeg især kan lide er Tap-til-skjul opsætning hvor du kan trykke hvor som helst på siden til skjul straks menuen. Dette er ikke indbygget i alle skydemenu plugin, men det er en funktion, der forbedrer brugeroplevelsen meget.

Denne plugin er helt åben og koden er tilgængelig gratis på GitHub hvis du vil poke rundt. Imidlertid mangler repo et klart sæt dokumentation, der gør opsætningen hårdere.

Heldigvis kan du finde dette på hovedstedet med fuld brug guider for at få Slidebars op og kører hurtigt.

Det understøtter glidende menuer fra alle fire sider af skærmen, sammen med brugerdefinerede funktioner til animationseffekter, farvevalg og total bredde / højde på menuen.

Hele glidemenuen virker på et element uden for siden, så du skal indstil menuen uden for lærred korrekt. Dette omfatter både korrekt HTML og den korrekte CSS til styling.

Alt dette er detaljeret omhyggeligt i dokumentationen, så hvis du følger siderne trin for trin, skal du få det til at fungere fint. Og standardopsætningen kræver ikke nogen brugerdefinerede egenskaber, så hvis du bare følger de grundlæggende trin, har du ingen problemer.

Slidebars er virkelig en fuld ramme og det har endda en brugerdefinerede API du kan arbejde over. Det giver dig mulighed for ring jQuery funktioner at tilføje funktioner eller tilpasse standardfunktionalitet. Et fremragende valg til udviklere, der har brug for en glidende menu, men ikke ønsker at lave en fra bunden.

Hvis du er nysgerrig efter at lære mere, se Slidebars hjemmeside. Det har bogstaveligt talt alt hvad du behøver at vide og masser af demoer at gå rundt.