Beste,

Ik vraag me af,
als je over een woord gaat, verschijnt er een klein venstertje en als je onmouseout doet gaat het venstertje terug weg,
heeft iemand hier een goede tutorial/script voor??

ben een javascript noobje :p
I know..
Maar wist niet direct op welke zoektermen ik zou moeten zoeken
[google]JavaScript ToolTip[/google]. ;-)
Waarom Javascript? Maak er een linkje van (een a tag) zet binnen die a tag een span en verberg deze standaard. (geef je a tag een bepaalde class (bijv "tooltip") mee.


<style>
a.meer_info{
    position:relative; /* dit is nodig om de tooltip voorlangs te laten lopen */
    z-index:24;
    text-decoration:none;
	}

a.meer_info:hover{
	z-index:25; /* niet zeker of dit nodig is, mag misschien weg */
	cursor:pointer;
	}

a.meer_info span{
	display: none;
	font-size:12px
	}

a.meer_info:hover span{ /* Bij een hover (onmouseover) van de link zal de span wel getoond worden */
    display:block;
    position:absolute;
    font-size:0.9em;
    top:2em; left:2em; 
	width:250px;
    border:1px solid #454545;
    background-color:#ffffd1; color:#454545;
    text-align: left;
	padding:5px;
	}
</style>
<a class="meer_info" title="Titel van de link (hoef je niet in te vullen, je krijgt immers een tooltip)" href="#" onclick="return false;">De tekst die je wilt laten zien<span>Hier je inhoud van de tooltip, je kan gewoon HTML gebruiken</span></a>


Je hebt op zich geen JavaScript nodig voor een crossbrowser tooltip. Met CSS kan ook, en is (vind ik) de mooiste oplossing.
deze zal ik seffes is bekijken
thnx!
Want ik probeer javascript te vermeiden omdat de helft van de internetgebruikers hiervoor eerst een waarschuwingsscherm voor moet goedkeuren
Best handig die css...
enige spijtige is, dat hij met allemaal puntjes (Dotted) puntjes geeft rond de area geeft :(
Maar voor de rest heel handig...
Kwist ni da dat mogelijk was met CSS

Reageren