Popisky HTML elementů

Na internetu jsem narazil na krásný skript, ... a zbytek je historie :) Původně zde následoval text o onom scriptu, ale po nějaké době jsem jej nahradil Derovými Cotojátky. Jsou lepší, lépe editovatelné a funkční. A dělají to, že u vybraných HTML elementů zobrazují líbivé bubliny s popiskem.

Ne že by to každý využil, ale minimálně já ano. Často používám typickou Texy! syntaxi pro vysvětlení nějakého slova: "predestinace"((předurčení)). Slovo "předurčení" se po najetí myší na slovo "predestinace" objeví v popiskové bublině. Občas také přes bublinu dovysvětluji, kam vede nějaký odkaz, atd.

Vypadat to může takto:

Jen je nutné domyslet si kurzor, protože ten se mi nepodaří obyčejným stiskem klávesy PrintScreen uložit. Formátování bubliny podléhá obyčejnému CSS, každý si ji tedy může libovolně editovat.

Na jakém to funguje principu?

Do šablon sablona-index.html, sablona-clanek.html a sablona-text.html (klidně i jinam) je nutné vložit kód pro natažení Javascriptu:
<script type="text/javascript" src="funkce-tooltips.js"></script>.
Nejlépe někam na konec (!!).

Pro původní verzi bylo nutné vložit do HTMl šablon DIV element, což již neplatí. Ani změna v CSS souboru není nutně nutná, protože bubliny se formátují samotné a jen náročný uživatel si podle nápovědy v souboru funkce-tooltips.js upraví vše potřebné.

Tím by bylo zajištěno technické pozadí :)

U čeho se bude objevovat tahle bublina?

Prakticky u všech HTML elementů, kterým bude definován atribut class na hodnotu "tooltip". Tedy u <a href="#" title="tootlip">...cokoli...</span>.

Dále bez výjimky na všechny elementy ABBR, ACRONYM a SPAN, které budou mít vyplněné title atributy. Vztahuje se to na celou stránku, tedy ne jen na text.