Swiper中文论坛

标题: 可以执行多个连续动画的升级版的Swiper Animate [打印本页]

作者: 代码搬运工 时间: 2016-3-11 14:06
标题: 可以执行多个连续动画的升级版的Swiper Animate
本帖最后由代码搬运工于 2016-3-20 09:01 编辑

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

<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
优化了一下代码

作者: hsy0598 时间: 2016-3-14 10:54
下载不了，看不到。

作者: 代码搬运工 时间: 2016-3-16 09:19

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

能下载呀

作者: q310550690 时间: 2016-3-16 10:26
支持loop吗？

作者: q310550690 时间: 2016-3-16 10:36
并不支持同步播放

作者: 代码搬运工 时间: 2016-3-16 10:47

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

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

作者: 代码搬运工 时间: 2016-3-16 10:47

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

哪里需要同步播放？

作者: q310550690 时间: 2016-3-16 12:31

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

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

作者: q310550690 时间: 2016-3-16 12:33

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

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

作者: 代码搬运工 时间: 2016-3-16 12:54

q310550690 发表于 2016-3-16 12:31
比如说，flip动画出现的不那么突兀，加了一个fadein 这两个动画要是同时运行，flip就会显得很自然。 ...

不可以同时动画，自己写css就可以实现

作者: 代码搬运工 时间: 2016-3-16 12:54

q310550690 发表于 2016-3-16 12:33
官方的在谷歌浏览器上是正常的，但是在移动端第一页就没有动画效果了。 ...

我试过在微信是可以的

作者: 代码搬运工 时间: 2016-3-16 12:58

q310550690 发表于 2016-3-16 12:33
官方的在谷歌浏览器上是正常的，但是在移动端第一页就没有动画效果了。 ...

我试过手机本机浏览器和uc浏览器都是正常的

作者: q310550690 时间: 2016-3-16 16:03

代码搬运工发表于 2016-3-16 12:58
我试过手机本机浏览器和uc浏览器都是正常的

在微信的X5内核浏览器里试试看？

作者: 代码搬运工 时间: 2016-3-16 17:36

q310550690 发表于 2016-3-16 16:03
在微信的X5内核浏览器里试试看？

在微信查看是正常的

作者: q310550690 时间: 2016-3-16 19:49

代码搬运工发表于 2016-3-16 17:36
在微信查看是正常的

我改了下源码，貌似解决了。

作者: 代码搬运工 时间: 2016-3-19 11:57

q310550690 发表于 2016-3-16 12:31
比如说，flip动画出现的不那么突兀，加了一个fadein 这两个动画要是同时运行，flip就会显得很自然。 ...

可以用镶嵌的办法实现

作者: anglehot 时间: 2016-3-21 18:38
怎么解决的苹果的微信不行，一个动画不显示

作者: songxsh 时间: 2016-3-28 20:57
感谢分享!!!

作者: assamy 时间: 2016-3-30 13:12
楼主好人

作者: MoonLight 时间: 2016-3-30 16:11
谢谢分享

作者: shanbochun 时间: 2016-4-1 15:47
谢谢分享

作者: 麦尼玛 时间: 2016-4-20 17:10

谢谢分享，好好学习，天天向上

作者: 记忆力 时间: 2016-5-13 13:49
感谢分享

作者: 无道1999 时间: 2016-5-13 17:03
可以下载吗？

作者: zhangjunjun 时间: 2016-8-4 14:57
这么牛逼啊，太厉害了

作者: 印象互动俊 时间: 2017-5-22 15:17
12312321311

欢迎光临 Swiper中文论坛 (http://bbs.swiper.com.cn/)