css for a sidebar menu that folds in and out

css menu sidebar
Justin Othername picture Justin Othername · Jan 29, 2014 · Viewed 38.9k times · Source

i've been looking around for tutorials on how to make a simple sidebar menu for a site that can fold in & out by clicking on a home button next to the sidebar menu, much like how main menus are opened in apps by clicking on a hamburger icon. I can't really find what i'm looking for, maybe i'm not using the right terminology.

Any help is appreciated, thx

B

Answer

Slavenko Miljic picture Slavenko Miljic · Jan 29, 2014

Not sure what kind of solution do you want, pure CSS, JS, jQuery etc but here are some links to get you started.

Try searching for "css slide out sidebar" or something along those lines

jQuery examples

http://www.hongkiat.com/blog/building-mobile-app-navigation-with-jquery/

http://www.berriart.com/sidr/

http://mmenu.frebsite.nl/

http://tympanus.net/codrops/2013/07/30/google-nexus-website-menu/

CSS Example

http://css-tricks.com/off-canvas-menu-with-css-target/

Related questions

How to make the HTML link activated by clicking on the <li>?

I have the following markup, <ul id="menu"> <li><a href="#">Something1</a></li> <li><a href="#">Something2</a></li> <li&…

Read More
How to make a HTML list appear horizontally instead of vertically using CSS only?

I need this because I want to make a menu (which is made from a HTML list) appear horizontally. I prefer not to use absolute positioning since it might become messy when I start changing the layout of the page. …

Read More
How to make a 3-level collapsing menu in Bootstrap?

I am trying to make a 3-level collapsing navbar menu for Bootstrap, but I can't open the third level. This is the two level menu which I have: I thought something like this would work: <link href="https://stackpath.…

Read More