使用 intro.js 使项目介绍更加完美
1. 引入js 和css(
intro.js
introjs.css
)
下载地址:
链接:https://pan.baidu.com/s/1_80KP2Fb_ri2L-H_UCVgFQ
提取码:buit
2. intro.js 参数说明
this._options = { /* 下一步按钮的显示名称 */ nextLabel: 'Next →', /* 上一步按钮的显示名称 */ prevLabel: '← Back', /* 跳过按钮的显示名称 */ skipLabel: 'Skip', /* 结束按钮的显示名称 */ doneLabel: 'Done', /* 引导说明框相对高亮说明区域的位置 */ tooltipPosition: 'bottom', /* 引导说明文本框的样式 */ tooltipClass: '', /* 说明高亮区域的样式 */ highlightClass: '', /* 是否使用键盘Esc退出 */ exitOnEsc: true, /* 是否允许点击空白处退出 */ exitOnOverlayClick: true, /* 是否显示说明的数据步骤*/ showStepNumbers: true, /* 是否允许键盘来操作 */ keyboardNavigation: true, /* 是否按键来操作 */ showButtons: true, /* 是否使用点点点显示进度 */ showBullets: true, /* 是否显示进度条 */ showProgress: false, /* 是否滑动到高亮的区域 */ scrollToElement: true, /* 遮罩层的透明度 */ overlayOpacity: 0.8, /* 当位置选择自动的时候,位置排列的优先级 */ positionPrecedence: ["bottom", "top", "right", "left"], /* 是否禁止与元素的相互关联 */ disableInteraction: false, /* 默认提示位置 */ hintPosition: 'top-middle', /* 默认提示内容 */ hintButtonLabel: 'Got it' };