logo

 

 

De 'tooltip' - deel 2 (javascript/CSS)

Zoals ik in deel 1 al zei: de 'tooltip' is een klein venstertje waar je informatie in kwijt kunt die je b.v. niet in de reguliere tekst wilt zetten. Je kunt dan gebruik maken van de standaard tooltip (die - in de IE browser - lichtgeel met een zwart randje is) of een javascript van het internet halen, waarbij je de kleuren zelf aan kunt passen. Ga maar met je muis over de hyperlink JavaScript_Kit en je ziet wat ik bedoel.

Ik heb voor de achtergrond van de javascript-tooltip de kleur 'thistle' gekozen en voor de rand de kleur 'gray'. In plaats van hexadecimale of RGB-kleurcodes kun je ook een kleurnaam in de code vermelden. Ik gebruik hiervoor deze kleurenkaart. Het script voor de tooltip kun je hier vinden.

* * *

Een tooltip met CSS maken kan ook.

Zet deze code in de style tags:

.popup { color: mediumvioletred;
cursor: help;
text-decoration: none
}

Dit is de HTML-code:

<span title=" dit is de tooltip-tekst " class="popup">~~ Vergeet niet een spatie voor en achter de title-tekst in de broncode te zetten ~~</span>

Beweeg nu je muis over deze tekst:

~~ Vergeet niet een spatie voor en achter de title-tekst in de broncode te zetten ~~


Zie ook deel 1.

 

Start | Tutorials | Korte Lesjes | CSS | Fonts | Filters | Links | Allerlei | Zoeken | PSP-varia | P-Filiaal

Copyright © 2004-2008 Plaatjesmakerij All rights reserved