求前辈指点,我非要搞定transition3d做轮播图!!
前辈,请看看我这个
用transform3d写的轮播图效果练习
用css3的transform3d写的轮播图效果,逻辑不知道哪里出错,自动播放,点击圆点切换图片都没什么问题,就是点击右边的按钮,切换下一张,如果快速切换的,前辈可以点点看,就出错了,轮播图整个都切走了,变白了。。。。
困扰已久,望前辈指教!
这个是码云那个练习的地址练习地址
请问有前辈有用transform实现轮播图的demo吗??望借鉴,只要有两边按钮切换功能就可以了,我就想看看前辈的demo快速切换的时候会不会乱。。。
如果你对这篇内容有疑问,欢迎到本站社区发帖提问 参与讨论,获取更多帮助,或者扫码二维码加入 Web 技术交流群。
绑定邮箱获取回复消息
由于您还没有绑定你的真实邮箱,如果其他用户或者作者回复了您的评论,将不能在第一时间通知您!
发布评论
评论(1)
我看了一下,因为你用的是:"transform": "translate3d("+(-1200*index)+"px,0,0)"这个来控制展示图片的位置的,但是我用F12查看,你的代码会出现:transition: all 1s ease; transform: translate3d(-48000px, 0px, 0px); 48000甚至更多,,所以说,应该是你的index到了4没有清0到1.
你看下我图中标记的2处,我觉得换成>=比==好,这样越界就直接变了。。
至于出现你这种越界不变的情况,我个人认为是程序运行是需要时间的,,所以本来index=4应该要变成1,但是上面定时又运行,导致index++变成了4,所以再也变不回去,所以出问题了。