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

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

649 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搬家报错No input file specified
宝塔面板帝国cms搬家报错No input file specified

今天有客户向鸥哥求助说宝塔面板帝国cms搬家报错No input file specified,这...

23 2191
帝国CMS怎样做隔行变色的功能?
帝国CMS怎样做隔行变色的功能?

一些颜色比较丰富的站点对模板的样式有要求,例如隔行变色:一行默认色,一行红色...

16 688
帝国CMS文章页的seo标题在哪里?
帝国CMS文章页的seo标题在哪里?

很多朋友用惯了织梦CMS,转到帝国之后就非常困惑,因为织梦CMS的文章是有一个se...

1 479
帝国CMS有必要开发百度小程序吗?
帝国CMS有必要开发百度小程序吗?

百度小程序的开放生态对网站站长及企业商家而言,能够从中获取到什么呢?百度智...

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

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

1 727
帝国cms怎样判断会员是否登录的状态?
帝国cms怎样判断会员是否登录的状态?

许多站点需要做帝国cms会员投稿的功能,不仅可以借此盈利,还能有效促进seo排名...

0 422
帝国cms会员投稿后白屏怎么办?
帝国cms会员投稿后白屏怎么办?

今天客户遇到一个问题,会员发布投稿信息后白屏了。但信息会正常发布出来,后台...

2 523
怎样提高帝国cms的生成刷新效率?
怎样提高帝国cms的生成刷新效率?

帝国cms是一款功能强大的cms,不仅安全性高,还能够轻松驾驭20万以上的数据,牛逼...

1 584
推荐插件
帝国CMS内网用户静态站点文章访客统计插件
帝国CMS内网用户静态站点文章访客统计插件

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

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

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

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

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

0 558
帝国cms自动生成文章新闻目录插件下载
帝国cms自动生成文章新闻目录插件下载

用户体验是我们的需求,百度蜘蛛的认可更是我们的需求。毕竟,没有收录排名,何来...

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

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

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

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

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

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

0 493
帝国cms百度文字识别ocr接口对接插件
帝国cms百度文字识别ocr接口对接插件

许多网站会做一些小功能小插件给客户使用以增强用户黏性,比如图片转文字,这种...

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