Maison > interface Web > js tutoriel > Création des indices avec plaisir

Création des indices avec plaisir

Joseph Gordon-Levitt
Libérer: 2025-02-19 13:16:10
original
214 Les gens l'ont consulté

GRANDHINT: Un outil pour créer des conseils de site Web interactifs

GRAYHINT est un outil pour créer des invites interactives sur un site Web qui aide les utilisateurs à comprendre les fonctionnalités des applications Web. Il est gratuit à utiliser, prend en charge les zones en surbrillance de différentes formes, permet des retards proches et fournit une prise en charge des navigateurs croisés.

Fonctions de base:

  • GRATUIT ET FACILE À UTILISER: Le plaisir est entièrement gratuit et facile à utiliser.
  • Conseils interactifs: Créer des conseils interactifs qui attirent l'attention des utilisateurs sur les utilisateurs guidés pour comprendre les fonctions du site Web.
  • Forme personnalisée: prend en charge plusieurs formes de zone de surbrillance et s'adapte de manière flexible à différents éléments de page.
  • Paramètres de retard: Vous pouvez définir le temps de retard de l'invite pour optimiser l'expérience utilisateur.
  • Compatibilité des navigateurs croisés: Compatible avec les navigateurs traditionnels pour assurer une applicabilité généralisée.
  • Prise en charge du terminal mobile: prend en charge les périphériques Android, iOS et Windows à écran tactile.

comment utiliser:

  1. Installation: Installez à l'aide de Bower (bower install enjoyhint) ou téléchargez à partir du référentiel GitHub.
  2. Introduction: Introduire les bibliothèques de plaisir et jQuery dans les fichiers HTML (la version doit être supérieure ou égale à 1,7).
  3. Initialisation: Créez une nouvelle instance de plaisir: var enjoyhint_instance = new EnjoyHint({});
  4. Conseils de définition: Créer un tableau d'étapes d'invite enjoyhint_script_steps, chaque étape définit le contenu de l'invite, les événements de déclenchement, les styles, etc.
  5. Réglage de la configuration: Utilisez enjoyhint_instance.set(enjoyhint_script_steps); pour définir la configuration de l'invite.
  6. Exécuter: Appelez enjoyhint_instance.run(); Exécutez le script d'invite.

Exemple de définition de l'invite:

Une simple invite, surveille un bouton et afficher les instructions:

var enjoyhint_script_steps = [{
    'click .btn': '点击此按钮切换搜索结果',
    'skipButton': {className: "mySkip", text: "明白了"} //自定义跳过按钮
}];
Copier après la connexion

Créez une séquence rapide:

Par l'événement next, plusieurs invites sont affichées en séquence:

var enjoyhint_script_steps = [
    {'next .navbar-brand': '这是网站标题'},
    {'key #mySearch': '在此输入搜索关键词,按Enter键搜索', 'keyCode': 13},
    {'click .btn': '点击这里切换搜索类型'},
    {'next .about': '关于我们', 'shape': 'circle', 'radius': 70},
    {'next .contact': '欢迎反馈', 'showSkip': false} // 最后一个提示,隐藏跳过按钮
];
Copier après la connexion

Fonction de rappel:

GRAYHINT fournit des fonctions de rappel onStart, onEnd et onBeforeStart, qui effectuent des opérations personnalisées avant, après et avant que chaque invite ne commence respectivement.

Résumé:

GRAYHINT est un outil puissant et facile à utiliser qui aide les développeurs à créer des guides utilisateur interactifs et à améliorer l'expérience utilisateur. Ses options de personnalisation flexibles et sa compatibilité entre les navigateurs le rendent idéal pour les projets de développement Web.

Hints Creation with EnjoyHint Hints Creation with EnjoyHint Hints Creation with EnjoyHint Hints Creation with EnjoyHint Hints Creation with EnjoyHint Hints Creation with EnjoyHint Hints Creation with EnjoyHint Hints Creation with EnjoyHint Hints Creation with EnjoyHint

(Veuillez noter: Puisque je n'ai pas la possibilité d'accéder aux liens d'image externes, l'image ne peut pas être affichée. Veuillez remplacer le lien de l'image par le lien disponible réel.)

Ce qui précède est le contenu détaillé de. pour plus d'informations, suivez d'autres articles connexes sur le site Web de PHP en chinois!

Déclaration de ce site Web
Le contenu de cet article est volontairement contribué par les internautes et les droits d'auteur appartiennent à l'auteur original. Ce site n'assume aucune responsabilité légale correspondante. Si vous trouvez un contenu suspecté de plagiat ou de contrefaçon, veuillez contacter admin@php.cn
Derniers articles par auteur
Tutoriels populaires
Plus>
Derniers téléchargements
Plus>
effets Web
Code source du site Web
Matériel du site Web
Modèle frontal