jQuery
【jQuery】プラグインを使用したクールエフェクトとページ設定easyPaginate.JS
October 19, 2017

jQuery.easyPaginateは、リスト、リンクなどをページングするプラグインです。easyPaginateはかなり軽量、いくつかの便利なオプションがあり、Chrome、Firefox、Opera、Safari と互換性があります。
jQueryとjquery.easyPaginate.jsコードをインクルード
<script src="http://code.jquery.com/jquery-latest.js"></script> <script src="jquery.easyPaginate.js"></script>
<div id="easyPaginate"> <img src="img/demo/surf1.jpg" /> <img src="img/demo/surf2.jpg" /> <img src="img/demo/surf3.jpg" /> <img src="img/demo/surf4.jpg" /> <img src="img/demo/surf5.jpg" /> <img src="img/demo/surf6.jpg" /> <img src="img/demo/surf7.jpg" /> <img src="img/demo/surf8.jpg" /> <img src="img/demo/surf9.jpg" /> </div>
/* Cosmetic only */
#easyPaginate {width:300px;}
#easyPaginate img {display:block;margin-bottom:10px;}
.easyPaginateNav a {padding:5px;}
.easyPaginateNav a.current {font-weight:bold;text-decoration:underline;}
$('#easyPaginate').easyPaginate({ paginateElement: 'img', elementsPerPage: 3, effect: 'climb' });
MIT