Making the tour functional
Now that the layout of our page is complete, let's discuss in brief how we are going to implement the tour functionality. We have already created a tour.js
file that we will use for writing all the JavaScript code.
We will initialize the accordion for which we have already written the markup, and we will also initialize the tooltip that will appear on hovering over the Contact Us link.
After that, we will define a jQuery UI dialog
component with some basic settings and buttons for navigating the tour. Next, we will define a JavaScript array that will contain all the steps of the tour. Finally, we will create a tour object, and we will write the functions that will initialize the tour, display a tour step, and handle the ...
Get Mastering jQuery UI now with the O’Reilly learning platform.
O’Reilly members experience books, live events, courses curated by job role, and more from O’Reilly and nearly 200 top publishers.