这是一款基于原生 JavaScript、Canvas 与 Web Animations API技术实现的点击落贴并卷边展开的表情贴纸动画。点击空白画面，一枚随机表情会落在附近，带着白色纸边和轻微旋转，卷起的一侧逐渐展开，最后平整地留在页面。Canvas 将表情转成图片，脚本建立卷边层，浏览器动画推进展开过程。连续点击可以叠出多张不同大小的贴纸，适合互动留言、活动页和趣味背景。
随机表情贴纸落下时会发生什么
落点跟随指针。脚本把点击位置换算为舞台内比例，并结合贴纸尺寸限制边缘位置。
每张贴纸都有变化。表情、尺寸、静止旋转角和卷曲方向可随机生成，避免连续点击完全一致。
展开后精简结构。动画结束会移除卷边相关层与变量，只留下平整图片，减少已落定贴纸的持续负担。
卷边贴纸如何由分层与动画组成
卷边不是一段视频，而是几层裁切、镜像与阴影共同组成。脚本根据展开方向计算投影和反射参数，再动画更新注册过的进度变量。表情图片按内容与尺寸缓存，相同组合可以复用生成结果；贴纸类也保留 clear 方法，便于接入清空按钮。
const EMOJI_RE = /\p{Extended_Pictographic}/u;表情落贴的图片、尺寸和数量如何调整
表情候选在 script.js 的 palette 数组，默认尺寸范围、展开时间和回调入口在 SETTINGS 中；纸边、阴影与卷曲层样式位于 style.css。可以替换为本地贴纸图片，或给舞台增加清空、数量限制与撤销入口。当前演示会一直叠加，长期展示时应主动控制总数。
网页贴纸的字体与浏览器适配疑问
表情在不同电脑上会一样吗？
不一定。表情由系统字体绘制，不同系统可能有不同造型。需要统一视觉时，建议改成自有的本地图片。
手机点击也能贴吗？
舞台使用 pointerdown，可以响应触摸，但贴纸随机尺寸上限较大，小屏可能出现较满的画面。可按设备降低最大尺寸。
为什么旧浏览器没有卷边动画？
它使用浏览器动画接口和 CSS 自定义属性动画，旧环境可能缺少完整能力。建议在目标浏览器实测，必要时准备直接落贴的简化效果。
适合节日互动、趣味装饰与贴纸交互实验。完整贴纸类、卷边结构和回调方式可下载查看。
