Here is a constantly updated list of the 10 best JavaScript and CSS-based mobile app-style off-canvas navigation menus we published on CSSScript.com.
I hope you like it and don’t forget to spread the world.
Originally Published Nov 10 2017, updated Apr 05 2021
1. Touch side swipe
A Vanilla JavaScript plugin used to create a mobile-friendly off-canvas side menu that supports touch swipe events.
2. Animated Sidebar Navigation with JavaScript and CSS
A JavaScript & CSS based sidebar interaction concept for easily creating an off-canvas sidebar navigation that you can hide/show based on user actions.
3. Slide Menu
This is the vanilla JavaScript version of the jQuery slide menu plugin that helps web developers implement a smoothly sliding, multi-level, off-canvas navigation in vanilla JavaScript.
4. CSS Only Responsive Fixed Sidebar Navigation
A CSS only responsive fixed sidebar navigation that collapses into a bottom nav bar on mobile devices.
5. Responsive Sidebar Navigation with JavaScript and CSS3
Vertical Responsive Menu is a small JavaScript library that helps you create a mobile-friendly, fully responsive and space-saving sidebar navigation for your web projects.
6. Sidebar-Menu
A hamburger sidebar navigation (also called off-canvas menu & push menu) built using checkbox input, CSS/CSS3, and Font Awesome icons.
7. Off-canvas Sidebar Push Navigation In Pure CSS/CSS3
A mobile-first, off-canvas sidebar navigation (push menu) system written in pure CSS/CSS3 and checkbox tricks.
8. Pure CSS Sidebar Toggle Menu – Sidekick
A pure HTML / CSS based off-screen sidebar menu for your mobile site navigation.
9. Menue
A responsive, multi-level, cross-platform dropdown/off-canvas navigation system for both desktop and mobile.
10. 5 Off-canvas Hamburger Navigation Variations
A project contains 5 off-canvas hamburger navigation variations from which you can choose to bring the native app navigation experience to your webpage.