- Foundation - Home
- Foundation - Overview
- Foundation - Installation
- Foundation - Starter Projects
- Foundation - Kitchen Sink
- Foundation - Global Styles
- Foundation - Sass
- Foundation - JavaScript
- Foundation - JavaScript Utilities
- Foundation - Media Queries
- Foundation - The Grid
- Foundation - Flex Grid
- Foundation - Forms
- Foundation - Visibility Classes
- Foundation - Base Typography
- Foundation - Typography Helpers
- Foundation - Basic Controls
- Foundation - Navigation
- Foundation - Containers
- Foundation - Media
- Foundation - Plugins
- Foundation SASS
- Foundation - Sass Functions
- Foundation - Sass Mixins
- Foundation Libraries
- Foundation - Motion UI
- Foundation Useful Resources
- Foundation - Quick Guide
- Foundation - Useful Resources
- Foundation - Discussion
Foundation - Off-canvas
Description
It sets off the navigation menu from the visible area and displays the main content.
The following table lists the some of the Off-canvas features −
| Sr.No. | Feature & Description |
|---|---|
| 1 |
Off Canvas Setup
You can create off canvas menu using .off-canvas class and data-off-canvas attribute. |
| 2 |
Multiple Menus
Foundation off-canvas creates multiple menus on the left and right side. |
| 3 |
Title Bar
You can toggle the off-canvas by using the title bar on both left and right sides. |
| 4 |
Reveal on Larger Screens
Sets the left and right hand off canvas on larger and medium screens using .reveal-for-medium or .reveal-for-large classes. |
| 5 |
Sass Reference
You can change the styles of the components by using SASS variables. |
| 6 |
JavaScript Reference
Foundation provides JavaScript components for the Off-canvas. |
foundation_containers.htm
Advertisements