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' };