杰奇cms官方版实现笔趣阁手机端分页样式

最新推荐文章于 2021-06-22 11:24:45 发布

kassilu

最新推荐文章于 2021-06-22 11:24:45 发布

阅读量921

点赞数

分类专栏： Daima 文章标签： php

本文链接：https://blog.csdn.net/weixin_47870004/article/details/106531652

版权

本文介绍了如何在杰奇CMS官方版基础上，通过JavaScript实现类似笔趣阁手机端的分页样式。通过解析并利用jQuery获取分页参数，用for循环动态生成DOM元素，实现分页效果。文中提供了改造分页代码、隐藏原始分页并用JS读取关键值的步骤，帮助将17MB等网站的手机端样式移植到杰奇CMS。

摘要由CSDN通过智能技术生成

最近在搞杰奇cms仿制一个类似笔趣阁的模板，看到它的手机端的时候，其实就知道这个分页肯定是官方版直接调用无法实现的，但是其实只要思路明确的话，利用js可以很好的实现整个效果。原理就是利用jquery根据class获取到分页的那些参数，然后一个for循环直接加进dom层。
还算完美，以下是效果图（手机浏览器进入）：

这个界面是完全抓取的现成的模板，所以css样式也是现成的，就不需要自己再去写了，所以如果以后要把17mb那些的手机端，移植到杰奇的官方程序上，这篇教程是很适用的。以老古小说网为案例https://www.laoguu.com咱们来看

代码如下：
总共分为三个部分，这是全部的代码，不过记得要先引入jquery

<div class="listpage"><span class="left"><a class="before" href="javascript:;">上一页</a></span><span class="middle"><select name="pageselect" id="pageselect" onchange="self.location.href=options[selectedIndex].value">
    </select></span><span class="right"><a