今天给大家带来的是一个正方形,从下往上的每个不规则的递增的效果。大家可以看一下右转圈,可以用在加载一些项目中,感觉这个反正是挺好看的,所以今天给大家拿出来看看。
选一选,看一下代码,我用的是开发工具是asperxp,用app的。
·首先定义了六块六个方块,虽然它在不停的动,但是可以明显可以看到是六块缩小、放大、缩小、放大一种效果。
·看一下css2,首先定义了一个整体的位置,然后进行了旋转和平移,把它变成了一个竖向。
·下面就是变换的动作,这个动作用在了每一个方块的里面,有十一点六,大家可以看到注视也在下面,就没必要一个一个给大家讲。
·下面是什么?从这到最下面,给每一个方块定义一个尾元素,尾元素是什么?是默认的和它的尾元这两种效果,包括这些动作,大家可以看到和颜色延迟,这种效果其实就是通过延迟来实现的。
·其实大家可以认真看一下,是放大、缩小、放大、做小,只是从上到六个模块的方块的颜色都不同而已,包括上边距都有一个距离。
·再看,主要是什么?就是3d的动画效果,这个就定义在了听一下设置的3d的动画,把在整体的布局上,所以展现效果也是挺好看的,可以给大家慢慢去滑动,就是整体的动画缩小、放大、变换。
·然后是每一个方块的,首先钥匙进行动画效果,然后进行每个方块的为元素,为元素整体的xo的旋转,这根据,这个也是为元素进行检测。
·下面就是给每个方块设置了不同的上面纸和颜色,动画效果最近代码有加就是有点多,但是如果数不够清楚,大家可以自己去写一下。
喜欢的可以收藏、点赞,原代码的可以找我oq进行去获取就行了。今天先讲到这。