Buduj dostępne przesuwne menu hamburgerowe z Offcanvas

Wolny Wtyczka Offcanvas jest jednym z wielu zasobów do przesuwania nawigacji. Możesz znaleźć kilka podobnych wtyczek online, ale Offcanvas wyróżnia się z kilku powodów.

To jest dość lekka biblioteka i chociaż działa na jQuery, to również niezbyt trudne do skonfigurowania. Dotyczy to zarówno kodu JavaScript, jak i kodu HTML, więc nie musisz w ogóle zmieniać domyślnej nawigacji.

Wtyczka Offcanvas pozwala wyznacz określone obszary, w których menu powinno się pojawić. Domyślnie jest to zazwyczaj lewa lub prawa strona ekranu, ale możesz także wybrać górę lub dół ekranu.

To sprawia, że ​​Offcanvas jest świetny więcej niż przesuwane menu hamburgerów. Może być używany do przesuwane paski powiadomień lub nawet pola wyboru umożliwiające przechwytywanie wiadomości e-mail.

Każdy panel działa w taki sam sposób, w jaki użytkownik może kliknij gdziekolwiek na stronie, aby ukryć przesuwane menu. I możesz skonfigurować polecenia klawiatury które działają zgodnie z wytycznymi ARIA dla właściwej dostępności sieci.

Aby zainstalować Offcanvas, wystarczy kopia jQuery razem z Pliki Offcanvas CSS / JS. Możesz to zrobić za pomocą npm, altany lub bezpośrednio z GitHub.

Również na stronie GitHub będziesz zobacz trochę przykładowego kodu możesz przerobić, dopasowując do swojej strony. Wszystko, czego potrzebujesz do przesuwanego nawigatora, to