Skip to main content

Pure CSS3 Off Canvas Menu with jQuery Toggle

By April 20, 2016Blog, CSS, CSS3, Flexbox
Pure CSS3 Off-Canvas Menu

This is a simple concept of an off canvas, responsive CSS3 menu. It uses purely CSS, albeit some pretty modern features (transforms, flexbox) that aren’t compatible with older browsers.

This example uses an interesting technique with hidden checkboxes, labels, and adjacent HTML elements. The checkbox toggle method is an interesting method for toggling elements without using jQuery. You can read a more in-depth description of the method from my older post on a CSS-only multi-step form.

The Example On CodePen


Author allure

More posts by allure

Leave a Reply

Designed by

best down free | web phu nu so | toc dep 2017