分享一段简洁的css来快速实现抖动提醒

给大家分享一段css

我在stackoverflow上看到的特别简洁

把它放到项目里以后呢

我们就可以把这个样式

应用在一些需要抖动的上面

比如说这个文本框哈

那我就可以把它加上这个样式

就可以了

比如在这

大家看他就抖了

所以呢我们可以在

代码里面写一个动态的样式

这个冒号class

然后呢这个样式等于一个变量

这就是一个 true / false

然后呢我们在点击确定的时候呢

让它等于true

过820毫秒呢

再把它变回false

因为这个动画会耗时820毫秒

大家看

0.82秒

然后呢就会有这种效果

大家看

那还可以呢把它放在表格里

比如我现在这个表格是可以多选的

但是呢不能选择性别为女的

大家看当我尝试点击第3行的时候呢

他这个女字就会抖动提醒用户

那这种的话呢

我们就需要在这个(table)绑定的数据集上

每1行加一个

这个抖动的属性

就这个shake

然后呢把女(口误,应该是“性别”)的这一列

用插槽的方式来写一个动态的样式

同样呢我们在点击的时候呢

再来处理一下

如果呢他是女

还是

我们让他对应这一行的shake等于true

然后过820秒再变为false就可以了

很简单

那这一段代码呢

大家可以在这个stackoverflow上找到

或者呢我刚才也把它放到了我github的代码片段里

大家从这也能找到

最后更新于