可以执行多个连续动画的升级版的Swiper Animate

代码搬运工 · 发表于 2016-3-11 14:06:07

本帖最后由代码搬运工于 2016-3-20 09:01 编辑

swiper.animate.countless.zip (1.15 KB, 下载次数: 1018)
//使用例子

<div class="ani" swiper-animate='[{"animate":"fadeInUpBig","delay":"0s","duration":"0.5s"},{"animate":"flip","delay":"0s","duration":"0.5s"}]' >Slide 1 Slide 1 Slide 1</div>

复制代码

animate：要执行的动画
delay：延时时间
duration：动画时间

2016/03/12:修复多个bug

2016/03/13:修复火狐的错误

2036/03/13:修复计算动画延时时间的错误

代码搬运工 · 发表于 2016-3-12 10:19:55

优化了一下代码

hsy0598 · 发表于 2016-3-14 10:54:48

下载不了，看不到。

代码搬运工 · 发表于 2016-3-16 09:19:19

hsy0598 发表于 2016-3-14 10:54
下载不了，看不到。

能下载呀

q310550690 · 发表于 2016-3-16 10:26:16

支持loop吗？

q310550690 · 发表于 2016-3-16 10:36:38

并不支持同步播放

代码搬运工 · 发表于 2016-3-16 10:47:19

q310550690 发表于 2016-3-16 10:26
支持loop吗？

我不知道官方的在loop会有什么问题，我在谷歌浏览器测试loop正常

代码搬运工 · 发表于 2016-3-16 10:47:43

q310550690 发表于 2016-3-16 10:36
并不支持同步播放

哪里需要同步播放？

q310550690 · 发表于 2016-3-16 12:31:59

代码搬运工发表于 2016-3-16 10:47
哪里需要同步播放？

比如说，flip动画出现的不那么突兀，加了一个fadein 这两个动画要是同时运行，flip就会显得很自然。

q310550690 · 发表于 2016-3-16 12:33:00

代码搬运工发表于 2016-3-16 10:47
我不知道官方的在loop会有什么问题，我在谷歌浏览器测试loop正常

官方的在谷歌浏览器上是正常的，但是在移动端第一页就没有动画效果了。