Texto em áreas da figura - on mouse over

[Tadeu Matos]

Tenho uma figura e estou criando áreas nela, ao passar mouse nessas áreas deve aparecer um texto.

Acontece que não consigo fazer o texto ficar alinhado. Estou usando esse código:

<tr align=left valign=top>

<td colspan="2" align="justify">

<div>

<map name="beachmap">

<table cellspacing=10 cellpadding=10>

<tr>

<td>

<area shape="rect" coords="80,116,223,184" href="#"

alt="texto" title="texto">

</td>

</tr>

O texto é um pouco grande. Já tentei tootip mas não consegui.

Preciso disso com urgência. Agradeço qualquer ajuda.

[Willian Gustavo Veiga]

Bom dia, tudo bem?

Parece que você postou no lugar errado. Se for referente a alinhamento você poderia ter postado em HTML/CSS. Se for referente ao tooltip você deveria ter postado no JavaScript. Moderadores, por favor? :)

Segundo, você não explicou muito bem o problema. O que você quer exatamente? Qual o problema? Você tem um link para que possamos visualizar o problema?

Um abraço, aguardamos o seu retorno.

[Tadeu Matos]

Desculpe a demora em responder. Estive fazendo outras tentativas porém não funcionou.

A situação é a seguinte:

Tenho uma figura e em algumas partes da figura ao passar o mouse deve aparecer algumas informações.

O código que estou usando é esse:

<table border=0 cellspacing=2 cellpadding=2 width="100%">

<tr>

<td colspan="2" class="separadorAzulEscuro">Estrutura</td>

</tr>

<tr>

<td colspan="2">&nbsp;

</td>

</tr>

<tr align=left valign=top>

<td colspan="2" align="justify">

<div>

<map name="beachmap">

<table cellspacing=10 cellpadding=10>

<tr>

<td>

<area shape="rect" coords="80,116,223,184" href="#"

alt="<i>Officer</i> Oficer texto texto texto texto texto texto texto texto texto texto texto texto texto texto texto texto texto texto texto testotexto texto texto" title="Oficer texto texto texto texto texto texto texto texto texto texto texto texto texto texto texto texto texto texto texto testotexto texto texto">

</td>

</tr>

<area href="#" shape="rect" coords="280,99,439,159" align="justify"

alt="Oficer texto texto texto texto texto texto texto texto texto texto texto texto texto texto texto texto texto texto texto testotexto texto textoOficer texto texto texto texto texto texto texto texto texto texto texto texto texto texto texto texto texto texto texto testotexto texto textoOficer texto texto texto texto texto texto texto texto texto texto texto texto texto texto texto texto texto texto texto testotexto texto textoOficer texto texto texto texto texto texto texto texto texto texto texto texto texto texto texto texto texto texto texto testotexto texto textoOficer texto texto texto texto texto texto texto texto texto texto texto texto texto texto texto texto texto texto texto testotexto texto texto"

title="Oficer texto texto texto texto texto texto texto texto texto texto texto texto texto texto texto texto texto texto texto testotexto texto textoOficer texto texto texto texto texto texto texto texto texto texto texto texto texto texto texto texto texto texto texto testotexto texto textoOficer texto texto texto texto texto texto texto texto texto texto texto texto texto texto texto texto texto texto texto testotexto texto textoOficer texto texto texto texto texto texto texto texto texto texto texto texto texto texto texto texto texto texto texto testotexto texto textoOficer texto texto texto texto texto texto texto texto texto texto texto texto texto texto texto texto texto texto texto testotexto texto texto">

</table>

</map>

</div>

<p><img src="/..../mapa_estrutura.jpg" width="700" height="388" border="0" alt="" usemap="#beachmap"></p>

</td>

</tr>

</table>

O problema é que o texto do alt é muito grande e perde a formatação. Quero um texto formatado, com várias linhas.

Tentei usar BubblePopup, mas não consegui.

Alguma dica de como resolver o problema?

[Tadeu Matos]

Consegui solucionar usando javascript. Mostra texto no onmouseover e esconde em onmouse out.