一.pageslide插件功能
实现现实隐藏侧边栏的功能。插件可以读取另个一html,也可以是当前页面中的元素。
二.pageslide官方地址
http://srobbin.com/jquery-plugins/pageslide/
官方地址上有demo,可以测试下使用效果
三.pageslide使用方法
pageslide使用非常简单,需要的操作有:
1.侧边栏的样式,在jquery.pageslide.css文件中,只有几条语句修改非常方便。
2.引用jquery与jquery.pageslide.css,jquery.pageslide.js文件。但是在jquery.pageslide.js文件中,定义了全局变量,变量赋值为$(‘body’),所以插件需要在页面body中引用,如果在head中引用的话,侧边栏操作是无法成功的。
<link rel="stylesheet" type="text/css" href="../jquery.pageslide.css" />
<script src="../lib/jquery-1.7.1.min.js" type="text/javascript"></script>
<!--需在页面body中引用-->
<script src="../jquery.pageslide.js"></script>
3.简单的初始化语句,只需一句话。我们需要指定侧边栏出现的位置与是否需强制关闭。direction定义侧边栏滑出方向。
//默认在左边显示
$(".first").pageslide();
//右边显示,需进行关闭操作
$(".second").pageslide({ direction: "left", modal: true });
官方demo中有用例,下载下来后看下就可以了。使用非常简单。