反馈与交互 · 点一下的回应
磁吸吸附Magnetic snap
- 想被按
- 有引力
- 回弹
鼠标靠近按钮时，按钮自己往光标那边挪一小段，像被吸住；移开时它弹回原位，回弹的时候还稍微过一点头。
什么时候用它
用在最关键的那一个动作上（结算、开始、发送）；一屏里放两个以上就没劲了，而且磁吸会让精确点击稍微变难，小图标按钮别用。
参数
radius 90px · translate = offset × 0.28 · back 400ms cubic-bezier(.34,1.56,.64,1) · inner label × −0.12
配方
磁吸吸附 → 400ms cubic-bezier(.34,1.56,.64,1)磁吸吸附 → radius 90px · translate = offset × 0.28 · back 400ms cubic-bezier(.34,1.56,.64,1) · inner label × −0.12
给 AI 的一句话
给这个主按钮加磁吸：指针进入按钮中心 90px 半径内时，读取指针相对按钮中心的偏移，把偏移乘 0.28 写成按钮的 translate（越近吸得越紧），内层文字反向位移 0.12 做视差；指针离开时用 400ms cubic-bezier(.34,1.56,.64,1) 弹回原位，要有一点过冲。