一款侧边栏隐藏的插件
代码使用 引用该插件是我在公司项目中开发使用的,本只涉及一种交互显示方式,项目开发完毕后,我又将改插件完善成多应用显示方式,本插件采用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、网站不提供资料下载,如需下载请到原作者页面进行下载。