brandonlprice
commented
1 year ago seems to work: .onhintsadded(function() { document.querySelector('.introjs-hint').click(); })
Closed brandonlprice closed 1 year ago
brandonlprice
commented
1 year ago seems to work: .onhintsadded(function() { document.querySelector('.introjs-hint').click(); })
I have not been able to get it to work with the code below. I have the data-step id as '1' in the html. It only shows the hint without the dialog though.
function listen(){ introJs().setOptions({ hints: [ { hint: 'Welcome. This guide will walk you through some key elements to this site. Click the HELP if you ever get stuck somewhere. Click Start to begin or Exit to close. 👋', element: '.region.map-middle-left'} ], hintButtonLabel: 'Start' }).onhintclose(function() { introJs().setOptions({ steps: [ { element: document.querySelector('.search-box'), title: 'Search', intro: 'Use this box to enter an Address, AIN or Intersection. Click HERE for more Search help.' }, { title: 'Toolbar Tabs', element: document.querySelector('.toolbar-tab-control'), intro: 'Toolbar Tabs. Several tabs for extra functionality. FIND - Identify, Query and Filter options DRAW/MEASURE – Self explanatory TASKS – Has some powerful functionality LINKS – External resources HELP – Everything you want to know about this application' }, { element: document.querySelector('.panel-scroll-container'), title: 'Welcome/Results Panel', intro: 'Welcome Panel shows recent updates and information. Results Panel will show details about features returned from clicking on the map.' }, { element: document.querySelector('.tab-inactive'), title: 'Layers/Legend', intro: 'Here is where you interact with the various layers in the application. There is a powerful filter tool and metadata for all layers. Click Legend to show the legend for visible layers' } ], doneLabel: 'The End', skipLabel: 'X', exitOnOverlayClick: false }).start(); }).addHints().showHintDialog(1); } setTimeout(listen, 12000);