主页及文档
http://flaviusmatis.github.io/simplePagination.js/
下载地址
https://github.com/flaviusmatis/simplePagination.js
效果图:
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd"> <html xmlns="http://www.w3.org/1999/xhtml"> <head> <meta http-equiv="Content-Type" content="text/html; charset=utf-8" /> <link type="text/css" rel="stylesheet" href="simplePagination.css"/> <script type="text/javascript" src="jquery-1.7.2.min.js"></script> <script type="text/javascript" src="jquery.simplePagination.js"></script> <title>分页测试</title> <script type="text/javascript"> $(function() { var selector = "#pageDiv"; $(selector).pagination({ //items: 100, //itemsOnPage: 10, pages: 10, edges: 1, displayedPages: 3, cssStyle: 'light-theme', prevText: '<', nextText: '>', onPageClick: changePage }); }); function changePage(index){ //alert(index); } </script> </head> <body> <div id="pageDiv"></div> </body> </html>
上一页、下一页变灰
jquery.simplePagination.js
找到
if (options.classes) { $link.addClass(options.classes); }
修改为
if (options.classes) { if("current" == $link.attr("class")){ $link.css({"background": "#cccccc", "border-color": "#cccccc"}); } $link.addClass(options.classes); }