前提・実現したいこと
同一ページ内で複数のページネーションを設定して、
設定した箇所のみ中身が切り替わるようにしたいです。
発生している問題・エラーメッセージ
ページネーションは表示されるのですが、リスト内全て表示されている上に、前後ボタンを押しても動きません。
下記サイトを参考にしています。
https://shanabrian.com/web/jquery/pagination.php
該当のソースコード
html
1<ul class="items"> 2<li>1</li> 3<li>2</li> 4<li>3</li> 5<li>4</li> 6<li>5</li> 7<li>6</li> 8<li>7</li> 9<li>8</li> 10<li>9</li> 11<li>10</li> 12<li>11</li> 13<li>12</li> 14<li>13</li> 15<li>14</li> 16<li>15</li> 17</ul> 18<div class="pagination"></div> 19 20<script> 21 $('.items').pagination({ 22 itemElement: '> li', 23 displayItemCount: 2, 24 paginationClassName: 'pagination-wrap', 25 paginationInnerClassName: 'pagination', 26 currentPageNumberClassName: 'current', 27}); 28</script>
試したこと
jQuery、プラグインがきちんと読み込まれていることは確認済みです。
確認したところ、ページネーション内に"current"がついていないので現在の場所がわかっていないのかなと思うのですが、何をどうすればいいか全くわかりません。
jQuery初心者なのでそもそもこれだけでリストの表示・非表示まで制御できるのかすらわかりません。
ヒントでもよいので何かアドバイスまたは、他にわかりやすいプラグインやもっと簡単な方法があればご教授のほどよろしくお願いいたします。
あなたの回答
tips
プレビュー