美文网首页
CSS 防止按钮重复点击

CSS 防止按钮重复点击

作者: hao_developer | 来源:发表于2023-03-09 11:49 被阅读0次

如下示意,pointer-events在0~2秒内的值都是none,一旦到达2秒,就立刻变成了all,由于是forwards,会一直保持all的状态

image.png
button{
  animation: throttle 2s step-end forwards;
}
button:active{
  animation: none;
}
@keyframes throttle {
  from {
    pointer-events: none;
  }
  to {
    pointer-events: all;
  }
}

相关文章

网友评论

      本文标题:CSS 防止按钮重复点击

      本文链接:https://www.haomeiwen.com/subject/nhvaldtx.html