控制边栏插件
控制边栏组件作为 AdminLTE 布局的右栏。
用法
该插件可以作为 jQuery 插件激活，也可以使用 data api 激活。要激活插件，你必须先为你的布局添加 HTML 标记，然后创建如下所示的切换按钮。
HTML 标记
<!-- Control Sidebar -->
<aside class="control-sidebar control-sidebar-dark">
<!-- Control sidebar content goes here -->
</aside>
<!-- /.control-sidebar -->
数据 api
将 data-widget="control-sidebar" 添加到任意按钮或 a 元素即可激活插件。
<a href="#" data-widget="control-sidebar">Toggle Control Sidebar</a>
jQuery
就像所有其他 AdminLTE 插件一样，也可以通过运行以下示例，使用 jQuery 激活切换按钮。
$("#my-toggle-button").ControlSidebar('toggle');
选项
| 名称 | 类型 | 默认 | 说明 |
|---|---|---|---|
| controlsidebarSlide | 布尔 | TRUE | 边栏是否应该滑动到内容上，还是将内容推开腾出自己的空间。 |
| scrollbarTheme | 布尔 | os-theme-light |
固定侧栏时使用的滚动条主题 |
| scrollbarAutoHide | 布尔 | l |
滚动条自动隐藏触发器 |
| target | 字符串 | .control-sidebar |
目标控制-边栏可用于控制多个控制-边栏。 |
| animationSpeed | 布尔 | 300 |
将动画/过渡速度设为与 scss 过渡速度相同。 |
提示！
可以使用任何选项通过 data-attributes 类似以下方法，在 768 像素宽度下启用自动折叠边栏。
<a href="#" data-widget="control-sidebar" data-controlsidebar-slide="false">Toggle Control Sidebar</a>
事件
| 事件类型 | 说明 |
|---|---|
| expanded.lte.controlsidebar | 在控制边栏展开后触发。 |
| collapsed.lte.controlsidebar | 在控制边栏折叠后触发。 |
| collapsed-done.lte.controlsidebar | 在控制边栏完全折叠后触发。 |
示例： $('#toggle-button').on('expanded.lte.controlsidebar', handleExpandedEvent)
方法
| 方法 | 说明 |
|---|---|
| collapse | 折叠控制边栏 |
| show | 显示控制边栏 |
| toggle | 切换展开和折叠控制边栏状态 |
示例： $('#toggle-button').ControlSidebar('toggle')