有前辈用过transition加transitionEnd事件写过轮播图吗???

发布于 2022-09-06 06:30:13 字数 282 浏览 15 评论 0

前辈好,如题,请问有前辈以前用过css3动画实现过无缝轮播图的demo吗??我想参考一下你们的源码是怎么写的。。

我自己写的时候,配合transitionend事件,无法实现最后一张图的跳转,永远都是直接滑到第一张,不知道哪里问题,并且左右的按钮点击事件,快速点击的话,整个图会切出去,也就是说transitionend事件在我快速点击下一张图的按钮的时候,是不生效的。。。

好多坑搞不懂,所以就想来问问有没有前辈有demo,必须是无缝滚动的那种,并且有左右按钮的,下标可以不用有。。。

打扰了,望指教!

如果你对这篇内容有疑问,欢迎到本站社区发帖提问 参与讨论,获取更多帮助,或者扫码二维码加入 Web 技术交流群。

扫码二维码加入Web技术交流群

发布评论

需要 登录 才能够评论, 你可以免费 注册 一个本站的账号。

评论(2

最单纯的乌龟 2022-09-13 06:30:13

你把index == 4放到transitionEnd里执行,在动画没有结束的时候如果鼠标不停点击,index会持续增加:
图片描述

这样当transitionEnd执行时,index == 4就不会成立,所以后面的逻辑都不会执行,也就造成了translate3d的值不断增加显示空白。

£噩梦荏苒 2022-09-13 06:30:13

题主,那个直接滑倒第一张的问题怎么解决的 :D

~没有更多了~
我们使用 Cookies 和其他技术来定制您的体验包括您的登录状态等。通过阅读我们的 隐私政策 了解更多相关信息。 单击 接受 或继续使用网站,即表示您同意使用 Cookies 和您的相关数据。
原文