- Framework7 教程
- Framework7 - 首页
- Framework7 - 概述
- Framework7 - 环境
- Framework7 组件
- Framework7 - 布局
- Framework7 - 导航栏
- Framework7 - 工具栏
- Framework7 - 搜索栏
- Framework7 - 状态栏
- Framework7 - 侧边栏
- Framework7 - 内容块
- Framework7 - 布局网格
- Framework7 - 覆盖层
- Framework7 - 预加载器
- Framework7 - 进度条
- Framework7 - 列表视图
- Framework7 - 手风琴
- Framework7 - 卡片
- Framework7 - 芯片
- Framework7 - 按钮
- Framework7 - 操作按钮
- Framework7 - 表单
- Framework7 - 标签页
- Framework7 - Swiper 滑块
- Framework7 - 照片浏览器
- Framework7 - 自动完成
- Framework7 - 选择器
- Framework7 - 日历
- Framework7 - 刷新
- Framework7 - 无限滚动
- Framework7 - 消息
- Framework7 - 消息栏
- Framework7 - 通知
- Framework7 - 延迟加载
- Framework7 样式
- Framework7 - 颜色主题
- Framework7 - 分割线
- Framework7 模板
- Framework7 - 模板概述
- Framework7 - 自动编译
- Framework7 - Template7 页面
- Framework7 快速点击
- Framework7 - 活动状态
- Framework7 - 长按事件
- Framework7 - 触摸涟漪
- Framework7 有用资源
- Framework7 - 快速指南
- Framework7 - 有用资源
- Framework7 - 讨论
Framework7 - 面板已打开？
描述
我们可以确定面板是否已打开。每当某个面板打开时，<body> 将具有如下所示的额外生成的类，这些类使用with-panel-[position]-[effect]规则。
当您以覆盖效果打开左侧面板时，body 将具有with-panel-left-cover类。
当您以显示效果打开左侧面板时，body 将具有with-panel-left-reveal类。
当您以覆盖效果打开右侧面板时，body 将具有with-panel-right-cover类。
当您以显示效果打开右侧面板时，body 将具有with-panel-right-reveal类。
您可以在 JavaScript 或 CSS 中使用它来检测打开的面板，如下所示：
在 JavaScript 中
if ($$('body').hasClass('with-panel-left-cover')) {
console.log('Left Panel is opened')
}
在 CSS 中
body.with-panel-left-cover .statusbar-overlay {
background-color: #333;
}
这将在面板打开时更改状态栏背景。
framework7_side_panels.htm
广告