html5仿蚂蚁森林效果代码,vue仿支付宝蚂蚁森林水滴

APP 需要做一个类似蚂蚁森林的功能模块，动效和蚂蚁森林接近，可以有多个水滴，可以控制位置，水滴上下浮动。

gif图如下所示：

soogif.gif

v-for="(item, index) in ballList"

:key="index"

class="ball_small"

:style="{

top: all_y[index] + 'px',

left: all_x[index] + 'px',

transition: 'all 2s',

backgroundImage:

'url(' + sbg[Math.round(Math.random() * (2 - 0) + 0)].url + ')',

backgroundSize: '100% 100%'

}"

>

1000

data() {

return {