JQuery Kochbuch (German Edition)

der Browser damit gezwungen ist, beim Rendern der Seite eine Pause einzulegen. Aber wenn wir Inhalte per CSS erst einmal verbergen, die wir später per JavaScript anzeigen wollen, ist das genau das Ergebnis, das wir haben wollen:

    Bevor überhaupt mit dem Rendern der Seite begonnen wird, schreiben wir eine CSS-Datei in den

, die all den Inhalt verbirgt, den wir später zeigen wollen, wenn der Anwender mit der Seite interagiert. Der Grund für das Schreiben der CSS-Referenz auf diese Art und Weise liegt darin, dass so bei ausgeschaltetem JavaScript der gesamte Inhalt sichtbar und erreichbar ist. Mehr zu dieser Technik finden Sie in Peter-Paul Kochs “Three JavaScript articles and one best practice“ .

Eigene Tooltips erstellen
    Problem
    Von Zeit zu Zeit kann es passieren, dass ein grafisches Element oder ein Aspekt der Oberfläche genauer beschrieben werden muss, der Designer aber aufgrund von Platzproblemen (oder wegen der Ästhetik) keinen wertvollen Bildschirm-Raum für zusätzlichen beschreibenden Text opfern möchte. In solch einem Fall muss man den Anwender, der sich mit dem UI noch nicht so auskennt, ein wenig an die Hand nehmen. Da ist ein Tooltip eine ideale Lösung. Allerdings unterstützt uns HTML da nur sehr rudimentär und das Attribut
title="..."
sorgt nicht für den gewünschten Effekt.
    Tooltips können eine gute Lösung darstellen, wenn Elemente der Benutzerschnittstelle beschrieben werden sollen, insbesondere dann, wenn sie mit Benutzereinstellungen verbunden werden können (»Nicht mehr anzeigen«). Allerdings werden dynamische Toolstips oft missbräuchlich angewendet, zum Beispiel bei Blogs, bei denen jedes einzelne Element auf einer Seite mit einem
title="..."
-Attribut einen Tooltip anzeigt, wenn sich der Mauscursor darüber befindet. Solche Fälle sollten vermieden werden, denn wenn alles und jedes als besonderer Fall behandelt wird, der einen Tooltip nötig hat, können die wirklich wichtigen Elemente nicht mehr hervorstechen und nichts ist mehr besonders. Das wäre so, als ob Sie jedes Wort in einem Satz besonders betonen. Wie bei jedem Web-Projekt sollte der Kontext des Inhalts das Vorgehen festlegen, nicht umgekehrt.
    Lösung
    Um dieses Problem zu lösen, können wir jQuery nutzen, um uns die Mausposition im für uns interessanten Bereich zu holen und dann dynamisch ein