按钮向上抖动效果怎么做

1

div里就写在class里面

这将为按钮添加一个名为bounce的关键帧动画,其中按钮将在不同的时间点上以一定的距离向上抖动。然后,通过将bounce_small_infinite类应用于按钮的父容器,您可以使按钮无限地应用这个抖动动画。

class=" bounce_small_infinite “

 

写在style里面 

复制代码
<style>
                                                                
                                                                @keyframes bounce {
                                                                  0%, 20%, 50%, 80%, 100% {
                                                                    transform: translateY(0);
                                                                  }
                                                                
                                                                  40% {
                                                                    transform: translateY(-10px);
                                                                  }
                                                                
                                                                  60% {
                                                                    transform: translateY(-6px);
                                                                  }
                                                                }
                                                                
                                                                .bounce_small_infinite {
                                                                  animation: bounce 2s infinite;
                                                                }

                                                            </style>
复制代码

 

 

 1

 

posted @   JS脚本  阅读(48)  评论(0编辑  收藏  举报
相关博文:
阅读排行:
· 10年+ .NET Coder 心语 ── 封装的思维:从隐藏、稳定开始理解其本质意义
· 地球OL攻略 —— 某应届生求职总结
· 提示词工程——AI应用必不可少的技术
· Open-Sora 2.0 重磅开源!
· 周边上新:园子的第一款马克杯温暖上架
历史上的今天:
2020-09-10 cURL 和 Wget 的优缺点各是什么#####curl详解不同
2020-09-10 宝塔面板能否集成意见安装curl功能
点击右上角即可分享
微信分享提示