swiper的interval值设为5s,使用三张5s的gif图。
首次切换渲染gif图展示正常。但继续切换后,gif图不是从相对的0s开始播放了,就是混乱的。
理应不是切换到某张gif图,gif图从相对0s播放gif到结束,然后切换到下一章gif图从相对0s播放gif到结束....依次循环?
代码片段:https://developers.weixin.qq.com/s/h55aEHmy7UEW
gif的时间等于swiper的interval时间,都为5s。
现结果是:安卓和开发工具正常轮播,gif也每次从初始播放;苹果gif用image渲染后播放正常,第二次后的循环到这个gif图时就播放不正常了。
请具体描述问题出现的流程,并提供能复现问题的简单代码片段(https://developers.weixin.qq.com/miniprogram/dev/devtools/minicode.html)。
既然gif实现不了,要不考虑一下用视频实现
video是可以控制播放位置的,还可以实现判断单个文件的播放时长,不需要硬编码成5s
mp4的视频,比gif的文件大小也小很多
丢出代码片段来我run个看看
<swiper style="width:600rpx" indicator-dots autoplay interval="5000" duration="500">
<swiper-item>
<image mode="scaleToFill" src="./1.gif" style="width: 600rpx; height: 500rpx;"></image>
</swiper-item>
<swiper-item>
<image mode="scaleToFill" src="./2.gif" style="width: 600rpx; height: 500rpx;"></image>
</swiper-item>
<swiper-item>
<image mode="scaleToFill" src="./3.gif" style="width: 600rpx; height: 500rpx;"></image>
</swiper-item>
</swiper>
试试当前swiper显示的时候才给图片设置src呢...
看不懂在说什么无趣
开发者工具内是理应的结果。但是到手机上就不是了~