方法二：用 GIF 制作上下抖动的动态图片

上下弹动效果能否正常显示，取💯决于运行环境是否支持动画、动🔥态图片格式和对应的客户端渲染方式。网页中应检查动画是否被全局样式覆盖，聊天中则应检查发送后是否被自动压缩或转成静态预览。

QQ弹弹上下抖动的三种实现路径

QQ弹弹上下抖动出现幅度过大时，应先减少 translateY 的数值或降低 GIF 每帧的位移距离，再调整动画时长。▶️一次同时修改多个参数，通常很难判断究竟是哪一项导致观感变化。

动画不明显🤔时，可以先把位移从 2 像素提🔍高到 4 至 6 像素，再检查背景和主体颜色是否有足够对比度。缺少弹性感时，应加入“上移—下落—小幅回弹—归位”的过程，而不是只设置向上和向下两个位置。