html网页引导,网站引导功能实现

欢迎加入前端交流群

背景：发布了新网站，需要引导用户操作或者发布了新功能需要展示给用户

实现：借助driver.js 第三方类库实现

demo：样式如下图

实现方式：点击查看示例代码

api介绍：

1 const driver = new Driver({ 2 className: 'scoped-class', // 放入你自定义的className

3 animate: true, // 是否使用动画，默认true

4 opacity: 0.75, // 背景透明度(0表示仅弹出且不覆盖)

5 padding: 10, // Distance of element from around the edges

6 allowClose: true, // Whether the click on overlay should close or not

7 overlayClickNext: false, // Whether the click on overlay should move next

8 doneBtnText: 'Done', // 结束按钮文字

9 closeBtnText: 'Close', // 关闭按钮文字

10 stageBackground: '#ffffff', // Background color for the staged behin