一款侧边栏隐藏的插件

前言

该插件是我在公司项目中开发使用的,本只涉及一种交互显示方式,项目开发完毕后,我又将改插件完善成多应用显示方式,本插件采用OOP编写完成的。 还有很多待完善的地方和不足,请多多指教!

代码使用 引用

<link rel="stylesheet" type="text/css" href="./side-sidebar.css"> ... <script src="./style/jquery.min.js"></script> <script src="./style/div_hide.js"></script> 容器 样式一

<div id="autoHide_div"> // 外部容器 <span class="title">Hello wrold // 标题    <i class="fixed-icon" title="固定表格"></i> // 固定侧边栏按钮 (按钮样式自行添加)  </span> <div>这里可以是div,ul,table等自定义内容</div> //自定义内容 </div> 注:此布局适用于(AutoHide_div_cz_down_left,AutoHide_div_cz_down_right,AutoHide_div_sp_left_down,AutoHide_div_sp_right_down) 样式二

<div id="autoHide_div"> // 外部容器       <div>这里可以是div,ul,table等自定义内容</div> //自定义内容 <span class="title">Hello wrold // 标题    <i class="fixed-icon" title="固定表格"></i> // 固定侧边栏按钮 (按钮样式自行添加)  </span> </div> 注:此布局适用于(AutoHide_div_cz_up_left,AutoHide_div_cz_up_right,AutoHide_div_sp_left_up,AutoHide_div_sp_right_up) 初始化

var auto = new AutoHide_div_cz_down_left({  el: '#autoHide_div', // 外部容器  view_line_height: 8, // 显示白边的高度或长度  body_color:'#FFF', // 容器背景颜色,默认白色  head_color: '#FFF', // 标题背景颜色,默认白色  fixedIcon_bgcolor: '#FFF', // 固定按钮的背景色,默认是'#FFF'  active_fixedIcon_bgcolor: '#FFF' //选中固定按钮的背景色,默认'#1f897f' }); auto.init(); 文档说明 对象说明

1.new AutoHide_div_cz_down_left //垂直方向-左下角

2.new AutoHide_div_cz_down_right //垂直方向-右下角

3.new AutoHide_div_cz_up_left //垂直方向-左上角

4.new AutoHide_div_cz_up_right //垂直方向-右下角

5.new AutoHide_div_sp_left_down //水平方向-左下角

6.new AutoHide_div_sp_left_up //水平方向-左上角

7.new AutoHide_div_sp_right_down //水平方向-右下角

8.new AutoHide_div_sp_right_up //水平方向-右上角

版权声明:

1、该文章(资料)来源于互联网公开信息,我方只是对该内容做点评,所分享的下载地址为原作者公开地址。
2、网站不提供资料下载,如需下载请到原作者页面进行下载。