我想实现点击产生水波纹的效果。
如果用伪类 :active 实现,只会在点击那一下有效,手指一离开效果直接没了。没有按照设定时长来完成动画效果。
然后我发现有个hover-class 属性可以提带 :active ,还有 hover-stay-time 这个属性来让动画效果保留一段时间。
但用hover-class又无法实现:active 长按的水波纹效果,实在有点纠结。
框架类型 | 问题类型 | API/组件名称 | 终端类型 | 微信版本 | 基础库版本 |
---|---|---|---|---|---|
小程序 | Bug | view | 工具 | 7.0.4 | 2.7.0 |
1 个回答
hover-class 是按下后添加什么类名
hover-start-time 是按下后几毫秒添加类名
hover-stay-time 是松开后几毫秒移除类名
完全可以实现:active可实现的效果呀
长按效果实现不了
你的长按效果指的是什么呢,手指移开前hover-class的类名是一直存在的,和pc上:active基本上相同的,有什么效果是:active能实现,hover-class不能实现的呢?
就像原生的水波纹效果啊
本来我是用:active 写的效果,长按效果和原生的一样,但是短按 离开的时候效果不能按预设时长跑完动画效果,会一下消失,所以我需要用到hover-stay-time
那你就把hover-stay-time的时长设置为动画时长,这样保证至少能放完一次动画,但会导致连续点击时,后几次点击没动画;要实现比较好的效果的话就用touch相关事件吧