Foundation comes with a module for off-canvas menus. Off-canvas menus are positioned outside the viewport and slide in when activated. In this recipe, you will learn how to set up an off-canvas menu for your Foundation project. Off-canvas menus require both CSS and JavaScript code.
For this recipe, you have to create a new Foundation project, as described in the Installing Foundation CLI recipe of this chapter. You will use the same styles as used before in the Creating semantic grids with Foundation recipe of this chapter to create an example of an off-canvas menu. The off-canvas requires JavaScript too. An explanation on JavaScript usage is beyond the scope of this book.