jQuery外掛程式jPaginate實現無重新整理分頁，jqueryjpaginate

jQuery外掛程式jPaginate實現無重新整理分頁，jqueryjpaginate

jPaginate是基於jQuery的動感滾動分頁外掛程式，它的表現形式是像分頁的按鈕一樣，非常有意思的是這些按鈕卻可以滾動，可以通過單擊或滑鼠滑向點兩側的小箭頭來控制按鈕的前後滾動。

PHP讀取第一頁資料：

<div id="pagetxt">   <?php   $query = mysql_query("select id,title,addtime from article order by id desc limit 0, 6");   while ($row = mysql_fetch_array($query)) {     $pubdate = date("Y-m-d", $row['addtime']);     echo '<p><span>' . $pubdate . '</span><a href="http://www.bkjia.com/js/' . $row['id'] . '.html" target="_blank">' . $row['title'] . '</a></p>';   }   mysql_close();   ?> </div>

jQuery

$("#demo3").paginate({   count: <?php echo $page; ?>, //總記錄數   start: 1, //開始顯示的頁數   display: 5, //分頁條顯示的頁數   border: true, //是否顯示頁碼的邊框   border_color: '#BEF8B8', //設定邊框的顏色   text_color: '#79B5E3', //設定頁碼的顏色   background_color: '#E3F2E1', //設定頁碼的背景色   border_hover_color: '#68BA64', //設定滑鼠滑向頁碼時頁碼邊框的顏色   text_hover_color: '#2573AF', //設定滑鼠滑向頁碼時頁碼的顏色   background_hover_color: '#CAE6C6', //設定滑鼠滑向頁碼時頁碼背景的顏色   images: false, //是否顯示頁碼導航箭頭   mouse: 'press', //設定為'press'時，當滑鼠滑嚮導航箭頭時，頁碼隨之滾動；設定為'slide'時，按一下滑鼠一次導航箭頭頁碼滾動一次。   onChange: function(page) { //當單擊頁碼時，回呼函數.   $("#pagetxt").load("article.php?p=" + page);   } });article.php$p = isset($_GET['p']) ? intval($_GET['p']) : "";  $result = mysql_query("select id from article"); $total = mysql_num_rows($result);  $pagesize = 6; //每頁顯示數 $page = ceil($total / $pagesize); //總頁數 if ($p) {   $startPage = ($p - 1) * $pagesize;   $query = mysql_query("select id,title,addtime from article order by id desc limit $startPage, $pagesize");   while ($row = mysql_fetch_array($query)) {     $pubdate = date("Y-m-d", $row['addtime']);     echo '<p><span>' . $pubdate . '</span><a href="http://www.bkjia.com/js/' . $row['id'] . '.html" target="_blank">' . $row['title'] . '</a></p>';   } }

以上所述就是本文的全部內容了，希望大家能夠喜歡。