用途:Driver.js 用于构建产品导览(多步走查)、单元素高亮、功能聚焦和脉冲提示信标。它通过遮罩页面、在目标元素周围挖出聚光区域并显示弹出框来实现。
主要能力:提供两个入口——导览/高亮使用 import { driver } from "driver.js" 与 driver.js/dist/driver.css;提示信标使用 import { hints } from "driver.js/hints" 与 driver.js/dist/hints.css,提示为独立包,仅按需加载。支持步骤数组、无元素居中步骤、CSS 选择器/Element/函数作为目标、弹出框自动翻转适配视口、多实例共存。常用配置包括 animate、overlayColor、overlayOpacity、smoothScroll、allowClose、stagePadding、stageRadius、showProgress、showButtons、popoverClass、disableActiveInteraction,以及 advanceOnClick、waitForElement、skipMissingElement。提供 drive、moveNext、movePrevious、moveTo、getActiveIndex、isActive、refresh、setSteps、destroy 等方法,以及 onHighlightStarted、onDestroyStarted、onDestroyed 等生命周期钩子。
使用方式:安装 npm install driver.js(或 pnpm/yarn)。当前版本 1.8.0,API 为 1.x。CDN 方式会暴露全局 window.driver.js.driver 与 window.driverHints.hints,但资料提醒不要直接使用 @latest,生产环境建议 npm 安装,若用 CDN 需固定版本并添加 SRI。框架无关,需在目标元素挂载后创建实例,卸载时 destroy;SSR 需守卫 document。样式可通过 popoverClass 与 CSS 变量定制。
适用场景:产品导览、新手引导、功能聚焦、脉冲提示、交互式点击驱动导览、多页可恢复导览等。
限制:资料未提供收费、价格、平台支持范围等信息;CDN 标签未固定版本且未验证,不应直接上线;弹出框位置为偏好而非保证。