Author: | SoorajSNBlaze333 |
---|---|
Views Total: | 1,265 views |
Official Page: | Go to website |
Last Update: | August 28, 2020 |
License: | MIT |
Preview:

Description:
Yet another JavaScript guided tour library that creates step-by-step tooltips to walk visitors through your webpage and highlight matched DOM elements.
How to use it:
1. Install & Import.
# NPM $ npm i tooltip-sequence --save
import createSequence from "tooltip-sequence"; import "tooltip-sequence/dist/index.css";
2. Or load the Tooltip Sequence’s JavaScript & CSS files from the dist
folder.
<link rel="stylesheet" href="./dist/index.css" /> <script src="./dist/index.min.js"></script>
3. Attach sequential tooltips to target elements:
const steps = [ { element: "#element-1", description: "Tour 1", }, { element: "#element-2", description: "Tour 2", }, { element: "#element-3", description: "Tour 3", } ],
4. Enable the guided tour.
createSequence({ sequence: steps });
5. Customize the welcome, confirm, and cancel text.
createSequence({ sequence: steps, welcomeText: "Let us take you on a quick tour of the page!", confirmText: "Let's start", cancelText: "Maybe later" });