angular-app-tour

Install

npm i web-app-tour

Usage

Add the WebAppTour at the root of your Application, passing the steps of the elements to highlight during the
Tour.
""

arrList should be an array of objects representing the tour steps.

onSendData is a function that will handle data sent back from the tour (e.g., user actions or progress).
vbnet

Live Demo

You can see the live demo of this project by clicking the link below:

Live Demo

Tour Provider

{targetId:"testone",title:'Title One',content:'First test content',navPath:'/',navTimer:5000}
{targetId:"secondpageTitle",title:'Title Two',content:'Second test content',navid:'secondPage',navTimer:5000},

targetId:string
This targetId acts as the connector between the plugin and the application. When the application starts, it searches for this ID in the DOM tags. Once it finds the corresponding element, it retrieves the offsetTop and offsetLeft properties and uses them to position and open the popup.

title:string
this key will show the title of the popup.

content:string
This key will show the description of the popup.

navid:string
navId is used to navigate to the next page, but we need to provide the exact ID for it to work properly.

navPath:string
navPath its used for nagivate to previous page.

navTimer:number
It will be used to wait for the ID to be found once the navId is triggered or the navPath is clicked.