0%

轮播新思路

项目有个大屏,要求把我做的7个大屏用3d相册形式放一个页面,项目经理找了html5的源码,但是不好放在vue里,所以我自己重写了,我用transform和转换视角做出了效果,有个问题,要求点击左右箭头图片看起来是轮播的,我本来思路都是v-on:class和v-if,v-show,我突然想到可以用数组,imgLists.slice(1).concat(imgLists.slice(0, 1))类似这样不就可以切换图片顺序,配合nth-child就好了,在这里记录一下。

20210414

项目经理早上说客户要求切换有动画效果,我之前的数组肯定是没有的,我考虑用v-on:style,从改变src数组变成改变style数组,然后translate不能这样写了,考虑用绝对定位top,left代替,方便只过渡位置,不过渡其他样式。最后发现确实可行,本来以为要重新想3d相册的思路,这样改动最少,有了思路几分钟就改好了。

-------------本文结束感谢您的阅读-------------