下载鸥 > 网站下载 > 开发教程 > 帝国CMS

帝国CMS结合JS自定义手机端内容分页样式

648 2021-02-05 16:07:26

收藏

帝国CMS自带的内容分页标签为[!--page.url--],在制作多终端模板的时候,[!--page.url--]在手机端就会显得太长了,如果删掉一些[!--page.url--]在电脑端又显得太短。

完美的方法是自定义一个分页函数,在对于新手朋友太难,这里精准像素分享一个简单的方法,利用JS来完成,不太完美但基本功能都能实现。

 

下面来说说代码,首先是模板代码

<div class="contentpage">
	<span class="pre">上一张</span>
<b class="nub"></b>
<span class="next">下一张</span>
<div id="page">[!--page.url--]</div>
</div>

然后是JS,

<script>
varnum=$("#page").find("em").text();
$(".nub").text(num);

$(".pre").click(function(){
varurl=$("#page").find("b").prev().attr("href");

if(url){
window.location.href=url;
}else{
$(this).text("没有了")
}
})
$(".next").click(function(){
varurl=$("#page").find("b").next().attr("href");
if(url){
window.location.href=url;
}else{
$(this).text("没有了")
}
})
</script>

最后是内容分页函数代码,在/e/class/t_functions.php里面

//返回内容分页
functionsys_ShowTextPage($totalpage,$page,$dolink,$add,$type,$search=""){
	global$fun_r,$public_r;
	if($totalpage==1)
	{
		return'';
	}
	$page_line=$public_r['textpagelistnum'];
	$snum=2;
	//$totalpage=ceil($num/$line);//取得总页数
	$firststr='<em>'.$page.'/'.$totalpage.'</em>';
	//上一页
	if($page<>1)
	{
		$toppage='<ahref="'.$dolink.$add[filename].$type.'">'.$fun_r['startpage'].'</a>';
		$pagepr=$page-1;
		if($pagepr==1)
		{
			$prido=$add[filename].$type;
		}
		else
		{
			$prido=$add[filename].'_'.$pagepr.$type;
		}
		$prepage='<ahref="'.$dolink.$prido.'">'.$fun_r['pripage'].'</a>';
	}
	//下一页
	if($page!=$totalpage)
	{
		$pagenex=$page+1;
		$nextpage='<ahref="'.$dolink.$add[filename].'_'.$pagenex.$type.'">'.$fun_r['nextpage'].'</a>';
		$lastpage='<ahref="'.$dolink.$add[filename].'_'.$totalpage.$type.'">'.$fun_r['lastpage'].'</a>';
	}
	$starti=$page-$snum<1?1:$page-$snum;
	$no=0;
	for($i=$starti;$i<=$totalpage&&$no<$page_line;$i++)
	{
		$no++;
		if($page==$i)
		{
			$is_1="<b>";
			$is_2="</b>";
		}
		elseif($i==1)
		{
			$is_1='<ahref="'.$dolink.$add[filename].$type.'">';
			$is_2="</a>";
		}
		else
		{
			$is_1='<ahref="'.$dolink.$add[filename].'_'.$i.$type.'">';
			$is_2="</a>";
		}
		$returnstr.=''.$is_1.$i.$is_2;
	}
	$returnstr=$firststr.$toppage.$prepage.$returnstr.$nextpage.$lastpage;
	return$returnstr;
}

CSS代码就不分享了,自己些吧。

本文地址:https://xzo.com.cn/develop/empire/222.html

有帮助,很赞!

信息来源:精准像素
导出教程 下载word版教程
发表评论 共有条评论
关于帝国CMS


帝国cms是一款功能极为强大的cms程序,性能强悍、安全性高,可轻松支持10万数据,高级开发人员可制作出能容纳千万数据量的网站,是国内最出色的开源cms程序之一,推荐企业用户使用

当前最新版本为7.5,8.0版本即将上线,新版本的核心优化点在于多终端的适配。

推荐帝国CMS开发教程
帝国cms后台信息列表标题显示不完怎么办?
帝国cms后台信息列表标题显示不完怎么办?

帝国CMS后台信息列表标题文字字数默认是被控制过的,超出一行会截断,一些相对...

15 800
帝国cms安装模板里没有install文件夹怎么办?
帝国cms安装模板里没有install文件夹怎么办?

许多客户在使用帝国cms建站后想要再做一个网站,但复制所有的文件到新服务器...

0 520
帝国cms怎样压缩静态页面代码?
帝国cms怎样压缩静态页面代码?

静态页面代码压缩一下可提高网站加载速度,如果程序非常复杂的话,可以节约带宽...

3 486
帝国cms开发json数据接口调用栏目信息
帝国cms开发json数据接口调用栏目信息

json数据由于其高效、强兼容性的特质受到许多开发者的青睐,帝国cms开发一个...

0 615
帝国cms怎样去掉面包屑导航里的隐藏栏目
帝国cms怎样去掉面包屑导航里的隐藏栏目

帝国cms有隐藏栏目的功能,但隐藏栏目的文章如果展示,面包屑导航里会带上被隐...

1 727
帝国cms动态页、静态页、伪静态页有什么区别?
帝国cms动态页、静态页、伪静态页有什么区别?

我们知道,帝国cms既可以做动态页,也可以做静态页,还可以做伪静态页。那么,他们...

0 569
帝国cms自定义页面为什么无法调用描述和关键词?
帝国cms自定义页面为什么无法调用描述和关键词?

帝国cms自定义页面常用于制作一些相对简单的页面,但如果注意过页面tdk,会发现...

0 431
帝国cms默认评论表情添加修改调用与删除
帝国cms默认评论表情添加修改调用与删除

帝国cms评论中默认的表情包是QQ表情,默认显示10个,可以添加可以修改,本文详细...

0 444
推荐插件
帝国cms百度AI图像去雾api接口对接插件
帝国cms百度AI图像去雾api接口对接插件

通过本插件,可以实现帝国cms网站对接百度云api实现图像去雾的功能。经过实际...

0 492
帝国cms在线考试系统模板插件
帝国cms在线考试系统模板插件

一直没看到好用的帝国cms在线考试插件,所以自己开发了一款。在线考试插件用...

0 1343
帝国cms多栏目多数据表自动审核推送插件
帝国cms多栏目多数据表自动审核推送插件

本插件基于帝国cms帝国cms每日自动审核插件,在自动审核指定条数信息的基础上...

0 981
帝国cms纳米数据接口(足球比赛中最新数据)
帝国cms纳米数据接口(足球比赛中最新数据)

帝国cms 对接纳米数据(www.nami.com)接口,本接口主要接收、整理足球比赛实时数...

0 481
帝国CMS内网用户静态站点文章访客统计插件
帝国CMS内网用户静态站点文章访客统计插件

本插件适用于内网用户,可查看单篇文章访问者ip地址。如果添加访问者ip组,可查...

0 601
帝国cms百度AI黑白图像上色api接口对接插件
帝国cms百度AI黑白图像上色api接口对接插件

百度开放了系列AI功能api如图像上色、图像去雾、图像修复、无损放大、清晰...

0 478
帝国cms百度AI图像清晰度增强api接口对接插件
帝国cms百度AI图像清晰度增强api接口对接插件

通过本插件,可以实现帝国cms网站对接百度云api实现图像清晰度增强的功能。经...

0 557
帝国cms网站会员登录与退出历史记录日志插件
帝国cms网站会员登录与退出历史记录日志插件

帝国cms默认只有上次登录时间与ip,没有一个记录清单,所以今天,我们分享这个帝...

0 445
客服QQ:341553759
扫码咨询 常见问题 >
官方交流群:90432500
点击加入