VISUAL LANGUAGE / DESIGN GUIDE

交互光标

Interactive Cursor Design

让光标附近的视觉反馈提示探索或操作,是桌面指针的辅助层。触摸、键盘和辅助技术无法依赖同一光标效果。

交互光标设计指南

本站编写的设计取舍与实现建议;实例是说明用的界面方案,不是客户案例、官方截图或效果承诺。目录中的部分条目是交互策略、业务布局或平台设计系统,并非同一层级的视觉流派。

设计原理

让光标附近的视觉反馈提示探索或操作,是桌面指针的辅助层。触摸、键盘和辅助技术无法依赖同一光标效果。

适用场景

创意作品集、图像探索和不影响核心任务的品牌展示。

不适用与取舍

表单、精确编辑、触屏主场景和任何隐藏系统指针才可用的流程。

实现方法

保留系统指针,装饰层 pointer-events: none;仅对精细指针设备启用。焦点有同等提示,请求帧更新并在页面不可见时停止。

具体界面示例

作品图片悬停时显示查看提示,键盘聚焦也显示入口,手机直接显示固定查看按钮。

常见误区

替换系统光标会使文本选择和状态难辨;不能把隐藏内容仅绑定到 hover。

延伸阅读

下列技术规范或官方文档可用于核对实现;本站示例与设计取舍由本站编写。

继续比较

结合材料、布局或父子变体比较选择。

启用 JavaScript 可切换浅深色、收藏、使用组件演示并复制提示词。实例用于解释设计,不代表真实业务业绩。