Costruisci menu di hamburger scorrevoli accessibili con Offcanvas
Il plugin gratuito di Offcanvas è una delle molte risorse per le navigazioni scorrevoli. Puoi trovare un sacco di plugin simili online ma Offcanvas si distingue per alcuni motivi.
È una libreria abbastanza leggera e, anche se funziona su jQuery, non è nemmeno difficile da configurare . Questo vale sia per il codice JavaScripts che per il codice HTML, quindi non sarà necessario modificare la navigazione predefinita in alcun modo.
Il plugin Offcanvas ti consente di designare alcune aree in cui dovrebbe apparire il menu . Di default, questo è solitamente il lato sinistro o destro dello schermo, ma puoi anche scegliere anche la parte superiore o inferiore dello schermo.Questo rende Offcanvas ottimo per qualcosa di più che semplicemente scorrere i menu degli hamburger. Può essere utilizzato per scorrere le barre di notifica o anche per attivare i messaggi di posta elettronica .
Ogni pannello funziona allo stesso modo in cui l'utente può fare clic in qualsiasi punto della pagina per nascondere il menu scorrevole . Inoltre, è possibile impostare comandi da tastiera conformi alle linee guida ARIA per una corretta accessibilità al web.
Per installare Offcanvas, è sufficiente una copia di jQuery insieme ai file CSS / JS di Offcanvas . Puoi estrarli attraverso npm, bower o direttamente da GitHub.
Inoltre, nella pagina GitHub, vedrai un po 'di codice di esempio che puoi rielaborare per adattarlo al tuo sito web. Tutto ciò di cui hai bisogno per il nav scorrevole è un
Questo viene attivato tramite un collegamento di ancoraggio che punta verso l'ID del tuo menu scorrevole. Ecco uno snippet di Offcanvas GitHub che illustra un breve esempio:
... ...
Se riesci a rielaborare leggermente l'HTML nella tua pagina, non dovresti avere problemi a configurare tutto questo.
La funzione offcanvas()
supporta anche le opzioni per modificare la velocità dell'animazione, la classe predefinita e le funzioni di callback che possono essere eseguite dopo l'apertura o la chiusura del menu.
Per saperne di più e vedere una demo dal vivo, controlla la pagina principale del plugin. Offcanvas è un'ottima scelta per la navigazione basata su jQuery se ti piacciono i menu degli hamburger.
5 segreti dei designer per lanciare la tua carriera giusta
Freelancing è un viaggio per ognuno di noi e impariamo e cresciamo dagli errori e dagli errori che facciamo sul lavoro. Imparare dai nostri errori è un passo cruciale nel cammino verso il successo.Prendi la mia esperienza, per esempio. Faccio lavori di freelance dalla parte, cerco solo progetti quando ho bisogno di soldi extra.
5 strumenti di tracciamento del tempo per una migliore produttività - Best Of
Il tempo è denaro. Soprattutto per i liberi professionisti, il tempo è l'elemento che determina quanto puoi ottenere in un giorno e imposta la tua percentuale di pagamento . Per aiutarti a sfruttare al massimo il tuo tempo, sul Web sono disponibili numerosi strumenti per il monitoraggio del tempo.