jone/mama-box
1
0
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases Wiki Activity

v26110457 页面鼓包摁宝宝冒出的小心改为实心红心

Browse Source
This commit is contained in:
deploy
2026-11-05 08:56:46 +00:00
parent 133116f3a6
commit d32f630db0
26 changed files with 104 additions and 101 deletions
Download Patch File Download Diff File Expand all files Collapse all files

15
js/bump.js
View File

@@ -16,7 +16,7 @@
摁中时的反馈（一次约 1.2 秒）：
0ms 轻震（安卓）+ 一声很轻的「噗」+ 按出一个窝，鼓包被压扁、往四周摊开
80ms 稍重一震 + 更轻的「啵」，鼓包往远离手指的方向滑开、沉下去，冒一颗小 ♡
80ms 稍重一震 + 更轻的「啵」，鼓包往远离手指的方向滑开、沉下去，冒一颗实心小红心（11-05 起，原来是空心 ♡）
松手 窝 duang duang 回弹，周围的内容跟着颤几下
600ms 三次里有一次：旁边轻轻反踢一下（宝宝不服气）
⚠️ iOS 的网页没有震动接口（微信 JS-SDK 也没有），苹果用户只有画面 + 声音。
@@ -40,9 +40,11 @@
st.textContent =
'.bump-layer{position:absolute;inset:0;z-index:3;pointer-events:none;overflow:hidden}' +
'.bump-layer canvas{position:absolute;inset:0;width:100%;height:100%}' +
'.bump-heart{position:absolute;margin:-10px 0 0 -8px;font-size:16px;line-height:20px;color:#F4593C;font-weight:700;' +
'text-shadow:0 1px 3px rgba(255,255,255,.9);animation:bumpHeart .9s cubic-bezier(.2,.9,.3,1) forwards}' +
'@keyframes bumpHeart{0%{opacity:0;transform:translateY(4px) scale(.4)}25%{opacity:1;transform:translateY(-6px) scale(1.15)}100%{opacity:0;transform:translateY(-30px) scale(.9)}}';
/* 11-05 用户：「点击小孩踢的那个位置，弹出的那个小心，让它变成一个实心的红心」→ 空心 ♡ 字符换成实心红心 SVG（同头图踢腿红心），稍放大、停留稍久 */
'.bump-heart{position:absolute;width:26px;height:26px;margin:-13px 0 0 -13px;' +
'filter:drop-shadow(0 2px 4px rgba(220,30,60,.3));animation:bumpHeart 1.1s cubic-bezier(.2,.9,.3,1) forwards}' +
'.bump-heart svg{display:block;width:100%;height:100%}' +
'@keyframes bumpHeart{0%{opacity:0;transform:translateY(4px) scale(.4)}25%{opacity:1;transform:translateY(-6px) scale(1.2)}60%{opacity:1}100%{opacity:0;transform:translateY(-30px) scale(.9)}}';
document.head.appendChild(st);
const layer = document.createElement('div'); layer.className = 'bump-layer'; layer.setAttribute('aria-hidden', 'true');
const cv = document.createElement('canvas'); layer.appendChild(cv);
@@ -267,9 +269,10 @@
function heart(x, y) {
const r0 = scrRect(), lr = layer.getBoundingClientRect();
const h = document.createElement('i'); h.className = 'bump-heart'; h.textContent = '♡';
const h = document.createElement('i'); h.className = 'bump-heart';
h.innerHTML = '<svg viewBox="0 0 24 24"><path d="M12 21.2l-1.4-1.3C5.4 15.3 2 12.2 2 8.4 2 5.3 4.4 3 7.4 3c1.8 0 3.5.8 4.6 2.2C13.1 3.8 14.8 3 16.6 3 19.6 3 22 5.3 22 8.4c0 3.8-3.4 6.9-8.6 11.5z" fill="#F0284A"/></svg>';
h.style.left = (x + r0.left - lr.left) + 'px'; h.style.top = (y - scr.scrollTop + r0.top - lr.top) + 'px';
layer.appendChild(h); setTimeout(() => h.remove(), 950);
layer.appendChild(h); setTimeout(() => h.remove(), 1150);
}
/* ---------- 摁宝宝 ---------- */