Tour

Hopscotch is a Javascript library . Hopscotch accepts a tour JSON object as input and provides an API for the developer to control rendering the tour display and managing the tour progress.

Start the Tour

Create your own tour

 var tour = {
id: "hello-hopscotch",
steps: [
 {
   title: "My Header",
   content: "This is the header of my page.",
   target: "header",
   placement: "right"
 },
 {
   title: "My content",
   content: "Here is where I put my content.",
   target: document.querySelector("#content p"),
   placement: "bottom"
 }
 ]
 };
 // Start the tour!
 hopscotch.startTour(tour);