javascript:花了一天时间解决了本来一小时就能搞定的事
此刻我的心情是无奈。。。
前天我打算写一个支持多图片同时滚动的类——就像某些网站下面展示友情链接那样的滚动。开始前我计划了一下我要实现的功能。
- 切换效果——只有滚动
- 可以单张图片切换,也可以多张图片切换
- 同时显示图片的张数与每次滚动的图片张数可以自定义
- 根据图片总数+同时显示张数+单次滚动张数,自动插入页码
关于第3点说明一下,就是比如我容器宽900,每个图片宽300,那无疑,我可以同时显示3张图片;但我可以每次向左滚动1张图片(或者2张,3张),也就是说不一定每次显示几张就必须滚动几张。
写到一半,一个让我郁闷一天的问题来了:如何计算出页码总数?
有几个数字是已知的:图片总数,每次显示图片数,每次滚动张数。我用傻瓜式的排列法列举了下面这个数列:
总张数 | 显示数量 | 单次滚动 | 总页码数 |
10 | 1 | 1 | 10 |
10 | 2 | 1 | 9 |
10 | 2 | 2 | 5 |
10 | 3 | 1 | 8 |
10 | 3 | 2 | 5 |
10 | 3 | 3 | 4 |
10 | 4 | 1 | 7 |
10 | 4 | 2 | 4 |
10 | 4 | 3 | 3 |
10 | 4 | 4 | 3 |
要一直排下去的话还有很多,比如一次显示5张,6张。。。但郁闷的是,我找不到页码数与前面三个数字的计算关系!
从昨天下午算到今天下午,整整一天了。。。有没有数学学的好的帮我看看上面数字的规律呢?都怪我高中数学不及格啊。。
更新:放出算法 —— Math.ceil((总张数 - 显示数量) / 单次滚动 + 1)
已得到评论1楼验证,不过他是1个小时就想出来了,而我用了一天。。。差距啊
专职web前端,精通html,css,熟练javascript.努力学习新知识中
博客文章欢迎转载,但抵制剽窃。
分类:
Javascript
【推荐】国内首个AI IDE,深度理解中文开发场景,立即下载体验Trae
【推荐】编程新体验,更懂你的AI,立即体验豆包MarsCode编程助手
【推荐】抖音旗下AI助手豆包,你的智能百科全书,全免费不限次数
【推荐】轻量又高性能的 SSH 工具 IShell:AI 加持,快人一步
· .NET Core 中如何实现缓存的预热?
· 从 HTTP 原因短语缺失研究 HTTP/2 和 HTTP/3 的设计差异
· AI与.NET技术实操系列:向量存储与相似性搜索在 .NET 中的实现
· 基于Microsoft.Extensions.AI核心库实现RAG应用
· Linux系列:如何用heaptrack跟踪.NET程序的非托管内存泄露
· TypeScript + Deepseek 打造卜卦网站:技术与玄学的结合
· 阿里巴巴 QwQ-32B真的超越了 DeepSeek R-1吗?
· 【译】Visual Studio 中新的强大生产力特性
· 10年+ .NET Coder 心语 ── 封装的思维:从隐藏、稳定开始理解其本质意义
· 【设计模式】告别冗长if-else语句:使用策略模式优化代码结构