Framework7 Side Panels - Framework7

« Previous Topics
Framework7 Status Bar
Framework7 Search Bar
Framework7 Toolbars
Next Topics »
Framework7 Content Block
Framework7 Layout Grid
Framework7 Overlays

What is the use of Side Panels in Framework7?

Description

Side panel in Framework2, moves to left or right side of the screen, for displaying the content. Framework7 allows including up to 2 panels (right side panel and left side panel) in the app. Users need to add panels in the beginning of the <body> and then choose opening effect by applying the classes listed below:

  • panel-reveal - This moves out whole app's content.
  • panel-cover - This makes the panel to overlay on app's content.

For example, below code shows how to use above classes:

Below table shows the panel types supported by the Framework7:

S.N.

Type & Description

1

Open and Close Panels
After adding panel and effects, user needs to add functionality to open and close the panels.

2

Panel Events
Panel events can be used to detect how user interacts with the panel.

3

Open Panels With Swipe
Framework7 provides a feature to open the panel with swipe gesture.

4

Panel is Opened?
Using with-panel-[position]-[effect] rule, it is easy to determine whether panel is opened or not.

« Previous Topics
Framework7 Status Bar
Framework7 Search Bar
Framework7 Toolbars
Next Topics »
Framework7 Content Block
Framework7 Layout Grid
Framework7 Overlays

List of Tutorials

List of Topics

Interview Questions

All rights reserved © 2020 Wisdom IT Services India Pvt. Ltd DMCA.com Protection Status

Framework7 Topics