Tooltips mit Dreamweaver CC / jQueryUI

Bis Adobe Dreamweaver CS6 konnte man zu einem beliebigen Element einen sogenannten „spry tooltip“ anfügen. Bei Dreamweaver CC ist das entfallen, dafür ist die Benutzung von jQuery UI eingebaut worden. In dessen Grundausstattung gibt es eigentlich das Tooltip-Widget in Form eines speziell verwendeten title-Attributs. Warum das bei Dreamweaver CC nicht wie alle anderen Widgets im Menü „einfügen > jQueryUI >“ enthalten ist, weiß ich nicht.

Zum Glück ist der Kunstgriff, das manuell nachzuholen, ganz minimal. Lediglich folgender Code muss in eine eigene Datei z.B. „eigene.js“ (Aufruf im Head-Bereich im Template) eingebaut werden:

<script>
$(function() {
    $(document).tooltip();
});
</script>

Quelle: Tooltip | jQuery UI

Das gewünschte Element bekommt dann ein title-Attribut, also vielleicht

<a href="..." title="das ist der Tooltip">Linktext</a>

Das Gestalten der Tooltips, ggf. noch nach verschiedenen Kriterien (class) wird beispielhaft hier beschrieben:

Quelle: Specify jQuery UI Tooltip CSS styles

Schreibe einen Kommentar

Deine E-Mail-Adresse wird nicht veröffentlicht. Erforderliche Felder sind mit * markiert