插件描述：jPages是一个客户端分页插件，它比其他大多数插件多了很多功能，比如自动翻页，滚动浏览，显示延迟，完全可定制的导航面板也集成项目与Animate.css和延迟加载。
jPages是一个客户端分页插件，它比其他大多数插件多了很多功能，比如自动翻页，滚动浏览，显示延迟，完全可定制的导航面板也集成项目与Animate.css和延迟加载。
兼容所有的浏览器
使用方法
下面的代码添加到您的网页的<head>部分：
1 2 3 | <link rel="stylesheet" href="css/jPages.css"><script src="//ajax.googleapis.com/ajax/libs/jquery/1.7.1/jquery.min.js"></script><script src="js/jPages.js"></script> |
如果你想使用Animate.css动画你还需要添加的文件：
1 | <link rel="stylesheet" href="css/animate.css"> |
示例源代码：
1 2 3 4 5 6 7 8 9 10 11 12 | <!-- Future navigation panel --><div class="holder"></div><!-- Item container (doesn't need to be an UL) --><ul id="itemContainer"><!-- Items --> <li>...</li> <li>...</li> <li>...</li> <li>...</li> <li>...</li> ...</ul> |
启动插件：
1 2 3 4 5 | $(function(){ $("div.holder").jPages({ containerID : "itemContainer" });}); |
这是怎样的“div.holder”源代码将看起来像（创建10页）
1 2 3 4 5 6 7 8 9 10 11 12 13 14 15 16 17 | !-- navigation panel --><div class="holder"> <a class="jp-previous jp-disabled">← previous</a> <a class="jp-current">1</a> <span class="jp-hidden">...</span> <a>2</a> <a>3</a> <a>4</a> <a>5</a> <a class="jp-hidden">6</a> <a class="jp-hidden">7</a> <a class="jp-hidden">8</a> <a class="jp-hidden">9</a> <span>...</span> <a>10</a> <a class="jp-next">next →</a></div> |
特别申明：
本站所有资源都是由网友投稿发布，或转载各大下载站，请自行检测软件的完整性！
本站所有资源仅供学习与参考，请勿用于商业用途，否则产生的一切后果将由您自己承担！
如有侵权请联系我们删除下架，联系方式：lei1294551502@163.com
- 上一个特效： jQuery过滤 分类 排序插件MixItUp
- 下一个特效： jQuery提示插件 qTip