Meilleure alternative à l'attribut 'title' pour stocker des données, comme des significations alternatives de mots - jquery, html

Je vais utiliser jquery pour montrer une alternativesignifications des mots que tout le monde ne saurait ni ne comprendra immédiatement. Pour un très mauvais exemple: "Johnny est un petit garçon." Un utilisateur peut cocher une case pour activer un mode dans lequel il serait désormais: "Johnny est un petit garçon." Encore une fois, exemple très simple. Je ne veux pas utiliser le title attribuer parce qu'il apparaît cette petite info-bulle laide. Certains pourraient être d'accord avec ça, je ne le suis pas.

Quel serait le meilleur attribut ou la meilleure méthode pour le faire? Créer mon propre attribut? Quels sont les avantages et les inconvénients?

Réponses:

<span data-easy="tiny, not large" class="easy"> small </span>

utiliser les données jQuerys, http://api.jquery.com/jQuery.data/

maby utilise CSS pour les afficher:

span.makeeasy[data-easy]:after { content: " (" attr(data-easy) ")"; }

puis mettez le contenu dans une DIV et ajoutez la classe "makeeasy" pour afficher les valeurs. (vous pourriez avoir besoin d'un repli pour les anciens serveurs)

C’est probablement une utilisation appropriée pour le Attributs de données HTML 5. Vous pouvez définir votre propre attribut, tel que data-translation, et l'utilise comme ceci:

Johnny is a <span data-translation="tiny, small, short">little</span> boy.

Vous pouvez ensuite écrire du code pour extraire les données du data-translation attribuer et l'insérer après la span élément lorsque l'utilisateur active les traductions.

Pourquoi ne pas utiliser une liste de définitions (dl) avec dd pour les définitions et dt pour les termes: http://w3schools.com/html/html_lists.asp

Je vous suggère d'essayer les données jQuery: http://api.jquery.com/jQuery.data/