漂亮实用的Bootstrap和Amazeui分页样式

查看演示 下载资源 下载积分： 20 积分

关注公众号，免费赠送安装视频教程、环境和学习视频，后面会不断更新。

js代码

<script type="text/javascript" src="js/jquery-1.11.0.min.js"></script>
	<script type="text/javascript" src="js/bootstrap.min.js"></script>
	<script type="text/javascript" src="dist/js/am-pagination.js"></script>
	<script type="text/javascript">
	var pager = jQuery('#ampagination').pagination({
		 page:5,
		 totals:100,
		 pageSize:10
	 });
	pager.onChangePage(function(e){
		jQuery('.showlabel').text('The selected page no: '+e.page);			
	});
	var pagersm = window.amPagination('#ampaginationsm',{
		page:5,
		totals:100,
		pageSize:10,
		btnSize:'sm'
	 });
	 jQuery('#ampaginationsm').on('am.pagination.change',function(e){
		jQuery('.showlabelsm').text('The selected page no: '+e.page);
		
	 });
	 var pagerlg =jQuery('#ampaginationlg').pagination({
		page:5,
		totals:100,
		pageSize:10,
		btnSize:'lg'
	 })
	 .onChangePage(function(e){
		jQuery('.showlabellg').text('The selected page no: '+e.page);
	 });
	</script>
	
	<script type="text/javascript">
	var pager = window.amPagination('#ampagination-bootstrap',{
		page:5,
		totals:100,
		pageSize:10,
		theme:'bootstrap'
	 });
	pager.onChangePage(function(e){
		jQuery('.showlabel').text('The selected page no: '+e.page);			
	});
	var pagersm = window.amPagination('#ampaginationsm-bootstrap',{
		page:5,
		totals:100,
		pageSize:10,
		theme:'bootstrap',
		btnSize:'sm'
	 });
	 jQuery('#ampaginationsm-bootstrap').on('am.pagination.change',function(e){
		jQuery('.showlabelsm').text('The selected page no: '+e.page);
		
	 });
	 var pagerlg =jQuery('#ampaginationlg-bootstrap').pagination({
		page:5,
		totals:100,
		pageSize:10,
		theme:'bootstrap',
		btnSize:'lg'
	 })
	 .onChangePage(function(e){
		jQuery('.showlabellg').text('The selected page no: '+e.page);
	 });
	</script>
	
	<script type="text/javascript">
	var pager = window.amPagination('#ampagination-amazeui',{
		 page:5,
		 totals:100,
		 pageSize:10,
		 theme:'amazeui'
	 });
	pager.onChangePage(function(e){
		jQuery('.showlabel').text('The selected page no: '+e.page);			
	});
	var pagersm = window.amPagination('#ampaginationsm-amazeui',{
		 page:5,
		 totals:100,
		 pageSize:10,
		 theme:'amazeui',
		btnSize:'sm'
	 });
	 jQuery('#ampaginationsm-amazeui').on('am.pagination.change',function(e){
		jQuery('.showlabelsm').text('The selected page no: '+e.page);
		
	 });
	 var pagerlg =jQuery('#ampaginationlg-amazeui').pagination({
		page:5,
		 totals:100,
		 pageSize:10,
		 theme:'amazeui',
		btnSize:'lg'
	 })
	 .onChangePage(function(e){
		jQuery('.showlabellg').text('The selected page no: '+e.page);
	 });
	</script>