Good cross-browser method for tooltips?

[Morten]

Hi. I'd like to be able to make tooltips for some "span" elements. So
I'd do like:
<dic class="toolbloc k">Stuff<spa n class="tooltip" >Something about
"Stuff"</span></div> and then use the below stylesheet:

div.toolblock span.tooltip {
display:none;
}

div.toolblock:h over span.tooltip {
display: block;
position: absolute;
top: 200px; left: 0; width: 125px;
padding: 5px; margin: 10px; z-index: 100;
background: #ffff80;
border: 1px solid;
}

I would like a more robust way that allows relative placement in
respect to the "span". What's the recommended approach?

Thanks.

Morten

[Markus Ernst]

Re: Good cross-browser method for tooltips?

Morten wrote:[color=blue]
> Hi. I'd like to be able to make tooltips for some "span" elements. So
> I'd do like:
> <dic class="toolbloc k">Stuff<spa n class="tooltip" >Something about
> "Stuff"</span></div> and then use the below stylesheet:[/color]
[...][color=blue]
> I would like a more robust way that allows relative placement in
> respect to the "span". What's the recommended approach?[/color]

Not exactly what you ask for, as you can't design it, but extremely
cross-browser and easy to use, also for inline use: The title attribute.

span.toolblock {
border-bottom:1px dashed red;
cursor:help;
}

Hello this is my <span class="toolbloc k" title="Vorschla g is German for
suggestion">Vor schlag</span>.

HTH
Markus

[Morten]

Re: Good cross-browser method for tooltips?

> > I would like a more robust way that allows relative placement in[color=blue][color=green]
> > respect to the "span". What's the recommended approach?[/color]
>
> Not exactly what you ask for, as you can't design it, but extremely
> cross-browser and easy to use, also for inline use: The title attribute.
>
> span.toolblock {
> border-bottom:1px dashed red;
> cursor:help;
> }
>
> Hello this is my <span class="toolbloc k" title="Vorschla g is German for
> suggestion">Vor schlag</span>.[/color]

Excellent! Thanks! :-)