haozid1的gravatar头像
haozid1 2016-08-24 12:08:20

JS简单带省略号的分页效果

处于首页状态时,是这样的~

JS简单带省略号的分页效果

处于非首页尾页时,是这样的:

JS简单带省略号的分页效果

处于末页时,是这样的:

JS简单带省略号的分页效果

原理解释:

页码用的是LI标签,通过改变UL的margin-left值实现当前页码居中;

省略号通判断当前页码,是否显示省略号,显示和隐藏是通过display控制,显示的时候遮在页码UL标签上面;

具体逻辑请看代码,本屌丝入行不久,这个也是项目需要写出来的,只是写出效果,代码质量~~~~~~~

JS部分代码截图:

JS简单带省略号的分页效果


打赏

文件名:JS分页.zip,文件大小:2.04K 下载
  • /
    • /JS分页.html
最代码最近下载分享源代码列表最近下载
微信网友_6040315240812544  LV8 2022年11月11日
microzeng  LV18 2022年4月2日
越走越远  LV1 2021年12月25日
yy8487886  LV1 2021年11月24日
GitHub121  LV11 2021年10月30日
一个学习者  LV1 2021年5月25日
猫喵喵的名字  LV6 2021年1月28日
912299793  LV21 2020年8月18日
我是大大泡泡糖  LV6 2020年2月15日
龙卷123456  LV1 2020年1月6日
最代码最近浏览分享源代码列表最近浏览
孙龙52  LV6 2023年7月14日
zyxlys  LV14 2023年6月6日
yjCASDAS  LV3 2023年5月9日
微信网友_6040315240812544  LV8 2022年11月11日
jjl2410708537  LV1 2022年10月26日
microzeng  LV18 2022年4月2日
weiranyi 2022年3月7日
暂无贡献等级
鱼汤有毒 2022年2月5日
暂无贡献等级
越走越远  LV1 2021年12月25日
nickshen111  LV8 2021年12月24日
顶部 客服 微信二维码 底部
>扫描二维码关注最代码为好友扫描二维码关注最代码为好友