Sidebar menu foldout on hover

Question

I would like to add to my page a sidebar menu that looks like the one on http://feedly.com/#discover

The way it works is that when you hover the sidebar, the menu shows up. When the mouse is out of the sidebar, the menu hides.

As an extra (feedly does not have it) I'd like that the content is pushed to the right when the menu folds out.

Could anyone please tell me how that could be made?

I tried looking into their source or find something similar, but couldn't...

Any indication on where to start looking would be very much appreciated!

Answer 1

This tutorial and demo may be of some help.

http://tympanus.net/codrops/2013/08/28/transitions-for-off-canvas-navigations/

It has an example of the push out side menu. You'll have to change the events to be on mouseover and mouseout of the toggle button and the side menu itself.