如何利用 Alpine.js 准确获取鼠标像素位置并实现实时动态径向模糊特效？
- 内容介绍
- 文章标签
- 相关推荐
本文共计1035个文字，预计阅读时间需要5分钟。
原文：
在 Alpine.js 项目中实现“以鼠标为原点的径向模糊”（如 bg-[radial-gradient(circle_at_#{$mouseX}_#{$mouseY},...)]）的关键，是让模板能直接消费形如 '127px' 的字符串值——这要求我们不仅捕获整数坐标，还需实时拼接单位，并确保跨浏览器兼容（尤其需兼容旧版 IE 对 pageX/pageY 的缺失支持）。
本文共计1035个文字，预计阅读时间需要5分钟。
原文：
在 Alpine.js 项目中实现“以鼠标为原点的径向模糊”（如 bg-[radial-gradient(circle_at_#{$mouseX}_#{$mouseY},...)]）的关键，是让模板能直接消费形如 '127px' 的字符串值——这要求我们不仅捕获整数坐标，还需实时拼接单位，并确保跨浏览器兼容（尤其需兼容旧版 IE 对 pageX/pageY 的缺失支持）。