Je voudrais avoir un indice d'introduction dans EnjoyHint que l'utilisateur peut passer en appuyant simplement sur "Suivant". Donc pas de flèche vers un élément. Est-ce possible?
3 Réponses :
HTML
var enjoyhint_script_steps = [
{
'click .hidden': '<h2>Introduction</h2><p>This is an introductory sentence, which tells you a bit about everything.</p>',
showSkip: false,
showNext: true,
margin: 0,
onBeforeStart: function () {
document.getElementsByClassName('enjoyhint_svg_wrapper')[0].style.display = 'none';
}
},
{
onBeforeStart: function () {
document.getElmentsByClassName('enjoyhint_svg_wrapper')[0].style.display = 'block';
},
...rest of step 2...
}
...rest of steps...
];
JS
<div class="hidden"></div>
<div class="hidden"></div> est un élément vide que EnjoyHint doit cibler.
'click .hidden': '...description...' cible l'élément vide et ajoute une description.
showSkip: false masque le bouton de saut.
showNext: true affiche le bouton suivant.
margin: 0 masque la zone mise en évidence par EnjoyHint.
onBeforeStart: function () {...} est utilisé pour masquer la flèche dans la première étape et l'afficher dans la deuxième étape.
Merci beaucoup. Je trouve que je dois faire attention à l'endroit où je place l'élément vide, car le placement du texte en dépend. Une flèche vers elle apparaît également pendant un instant lorsque l'utilisateur clique sur "Suivant". Mais c'est plus ou moins là.
var enjoyhint_script_steps = [
{
event: 'next',
selector: '.hidden', // or any element you want to highlight
description: '<h2>Introduction</h2><p>This is an introductory sentence, which
tells you a bit about everything.'</p>
showSkip: false,
showNext: true, // not necessary
onBeforeStart: function () {
$('#enjoyhint_arrpw_line').hide();
}
},
{
...rest of step 2...
}
...rest of steps...
];
Vous pouvez rendre div class="hidden" et rendre la flèche transparente
let enjoyhint_script_steps = [
{
'click .hidden': '<h2>Hello</h2>',
arrowColor:'transparent'
}
];