Framework7 - 側邊欄

描述

側邊欄移動到螢幕的左側或右側以顯示內容。Framework7 允許您在應用程式中包含最多 2 個面板（右側面板和左側面板）。您需要在<body>的開頭新增面板，然後透過應用以下列出的類來選擇開啟效果：

panel-reveal - 這將使整個應用程式的內容移出。
panel-cover - 這將使面板覆蓋在應用程式的內容上。

例如，以下程式碼顯示瞭如何使用上述類：

<body>
   <!-- First add Panel's overlay which will overlays app while panel is opened -->
   <div class = "panel-overlay"></div>
 
   <!-- Left panel -->
   <div class = "panel panel-left panel-cover">
      panel's content
   </div>
 
   <!-- Right panel -->
   <div class = "panel panel-right panel-reveal">
      panel's content
   </div>
 
</body>

下表顯示了 Framework77 支援的面板型別：

序號	型別和描述
1	開啟和關閉面板新增面板和效果後，我們需要新增開啟和關閉面板的功能。
2	面板事件要檢測使用者如何與面板互動，您可以使用面板事件。
3	使用滑動打開面板 Framework7 提供了使用滑動手勢打開面板的功能。
4	面板已開啟？我們可以使用with-panel[position]-[effect]規則確定面板是否已開啟。

列印頁面