/ / Beste Alternative zum Attribut 'title' zum Speichern von Daten, z. B. alternative Bedeutungen von Wörtern - jquery, html

Die beste Alternative zum Attribut "title" zum Speichern von Daten, wie alternative Bedeutungen von Wörtern - jquery, html

Ich werde jquery verwenden, um eine Alternative zu zeigenBedeutungen für Wörter, die nicht jeder sofort kennen oder verstehen würde. Für ein wirklich schlechtes Beispiel: "Johnny ist ein kleiner Junge." Ein Benutzer könnte ein Kontrollkästchen markieren, um einen Modus zu aktivieren, in dem er jetzt angezeigt wird: "Johnny ist ein kleiner (winziger, kleiner, kleiner) Junge." Wieder ein sehr einfaches Beispiel. Ich möchte das nicht benutzen title Attribut, weil es diesen kleinen hässlichen Tooltipp auftaucht. Einige mögen damit einverstanden sein, ich bin es nicht.

Was wäre das beste Attribut oder die beste Methode, um dies zu tun? Eigenes Attribut erstellen? Was sind die Vorteile und Gefahren?

Antworten:

2 für die Antwort № 1
<span data-easy="tiny, not large" class="easy"> small </span>

benutze jQuerys Daten, http://api.jquery.com/jQuery.data/

Maby verwenden CSS, um sie anzuzeigen:

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

Fügen Sie dann den Inhalt in eine DIV ein und fügen Sie die Klasse "makeeasy" hinzu, um die Werte anzuzeigen. (Für ältere Browser ist möglicherweise ein Fallback erforderlich.)


2 für die Antwort № 2

Dies ist wahrscheinlich eine angemessene Verwendung für die HTML 5-Datenattribute. Sie können Ihr eigenes Attribut definieren, z data-translationund benutze es so:

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

Sie können dann einen Code schreiben, um die Daten aus dem zu übernehmen data-translation Attribut und fügen Sie es nach dem ein span Element, wenn der Benutzer Übersetzungen aktiviert.


1 für die Antwort № 3

Warum nicht eine Definitionsliste verwenden (dl) mit dd für Definitionen und dt nach Begriffen: http://w3schools.com/html/html_lists.asp


0 für die Antwort № 4

Ich würde Ihnen empfehlen, jQuery-Daten auszuprobieren: http://api.jquery.com/jQuery.data/