This method only works for a running tour.
He switches the tour to the specified step.
<script src="../js/jquery-3.1.1.min.js"></script>
<link rel="stylesheet" href="../css/iGuider.css">
<script src="../js/jquery.iGuider.js"></script>
<link rel="stylesheet" href="../themes/material/iGuider-theme-material.css">
<script src="../themes/material/iGuider-theme-material.js"></script>
<script>
$(window).on('load',function(){
$('.start-tour').on('click',function(){
iGuider({
tourTitle:'Method "setStep"',
tourMap:{
open:true
},
steps:[{
title:'Step 1',
content:'Step 1 Description',
target:'el-1'
},{
title:'Step 2',
content:'Step 2 Description',
target:'el-2'
},{
title:'Step 3',
content:'Step 3 Description',
target:'el-3'
}]
});
return false;
});
$('.setStep-1').on('click',function(){
iGuider('setStep',1)
return false;
});
$('.setStep-2').on('click',function(){
iGuider('setStep','2')
return false;
});
$('.setStep-3').on('click',function(){
iGuider('setStep',3)
return false;
});
})
</script>
<p>
<a class="btn start-tour" href="#">Start Tour</a>
</p><div style="z-index:999999; position:relative; pointer-events:auto;">
<a class="btn-s setStep-1" href="#">Step 1</a>
<a class="btn-s setStep-2" href="#">Step 2</a>
<a class="btn-s setStep-3" href="#">Step 3</a>
</div>
<p></p>
<span class="custom-element" data-target="el-1">Element 1 </span>
<span class="custom-element" data-target="el-2">Element 2 </span>
<span class="custom-element" data-target="el-3">Element 3 </span>