AnimeCursor 简介

什么是 AnimeCursor ?

AnimeCursor 是一个在网页中用 支持逐帧动画的虚拟光标 替换 系统鼠标指针 的前端 JavaScript 库。
由于目前的 CSS cursor 并不真正的支持动画光标(虽然目前主流的浏览器支持将 cursor 设置为GIF格式的图片,但是实际上在网页中光标会保持静止),所以如果想实现真正具有动画效果的光标,就必须使用非原生的光标。

AnimeCursor 通过在页面中注入一个跟随鼠标移动的 DOM 元素,并根据用户设置自动生成动画光标,从而实现高度定制的逐帧动画鼠标光标体验。
你只需要准备好动画光标的图片,然后告诉 AnimeCursor 你需要什么光标,AnimeCursor 就会自动为你的网页添加动画光标,帮助你完成你美丽网页的最后一小块拼图。

AnimeCursor 并不模拟操作系统的光标行为,而是专注于 视觉表现,比如以下的应用场景:

事实上,AnimeCursor 适合任何可以用到逐帧动画光标的网站,AnimeCursor 的主要目标就是为需要更有趣、更自由的动画光标设计提供方便的实现方法。

当然,对于其他类型的页面,AnimeCursor 也能够发挥作用,例如:

AnimeCursor 提供完整的生命周期 API,对于部分区域需要严格遵系统光标行为的页面,可以通过调用 disable()enable() 在需要的地方动态开启和关闭 AnimeCursor。这样可以配合同样风格化的原生光标,即在需要的地方严格遵循系统光标行为,又能在整体上实现更丰富的效果。

※ 实际上,AnimeCursor 是我为了在我的个人网站里使用而编写的,最开始它只是我网站基础JavaScript的一部分。但在我意识到我可以不用在每一个新网站中重复的造轮子后,我决定把 AnimeCursor 剥离出来作为一个独立的JavaScript库。

特性

浏览器支持

已测试支持的浏览器有:

以下浏览器未完全测试:

AnimeCursor 依赖现代浏览器特性(如 pointer: fine 媒体查询),不保证在旧浏览器中正常运行。