❤️ SVG实现新版手机QQ的手势消除红点消息的动画Demo
Clone or download
Fetching latest commit…
Cannot retrieve the latest commit at this time.
Permalink
Type Name Latest commit message Commit time
Failed to load latest commit information.
.gitignore
README.md
index.html
paper.jpg
preview.gif
style.css
svg.js

README.md

cute-qq-redpoint

SVG+JS实现新版手机QQ的手势消除红点消息的动画。 可以打开手机QQ,在底部菜单消息一栏的红点上进行拖拽体验。 本插件欲实现的就是这个效果。

相关原理

Paper

自动忽略那些写的很丑的字......

演示

图片演示

codepen在线Demo

TODO

  • 实现弹性系数K
  • 模拟拉断的情况
  • 加入初始圆的半径缩小控制
  • 插件化处理