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.
30 estensioni Chrome per una migliore produttività nel 2017
Esistono numerose app di produttività per i cellulari e molti strumenti di produttività per PC. Ma lo sapevate che ci sono alcune estensioni Chrome davvero straordinarie che possono portare la vostra produttività a un livello superiore e aiutarvi a fare le cose in fretta, mantenendo al contempo la vostra sanità mentale.In
Visualizza i widget WordPress in modo condizionale in pagine particolari
Se si utilizza WordPress, è possibile aggiungere contenuto aggiuntivo nella barra laterale utilizzando i widget. WordPress, per impostazione predefinita, fornisce un set di widget per la visualizzazione di categorie di post, tag cloud, ricerca e calendario. Seguendo temi standard di WordPress come TwentyTen e TwentyTwelve, i widget verranno visualizzati in tutte le pagine - homepage, post, pagina e archivio.