WebMasteRs: ncsito hacer un mapa

[qaz]

Querí­a regalar un CD cn el siguiente diseño:
-- Página principal: un mapa d un pedazo d ciudad
-- En el mapa habrí­a cinco puntos
-- Al pasar el ratón por cada punto deberí­a surgir una ventanita con info sobre el monumento señalado
-- Al hacer clic sobre cada punto, deberí­a aparecer una foto o fotos del lugar

Algún modo d hacerlo rápido y fácil?
Algún program en special?

Gracias a to2 (incluso x leer sto aunque no tngáis na q aportar)

[Carlo]

Tanto si vas a hacerlo en Flash, o con HTML, utiliza capas invisibles con la información y las fotos, y los eventos de ratón (javascript en caso de que sea HTML, y Actionscript en el caso de Flash), para hacerlas visibles.

[Carlo]

Así­ serí­a en HTML con capas:

Código [Seleccionar] Expandir



<!------------graficos del mapa (localizacion absoluta)------------->

<div id="punto1" style="position:absolute;top:20px;left:550px"><a href="foto1.htm" onfocus="blur();"><img src="punto1.gif" width="60" height="60" border="0" onmouseover="ayuda1.style.visibility='visible';" onmouseout="ayuda1.style.visibility='hidden';"></a></div>

<div id="punto2" style="position:absolute;top:100px;left:670px"><a href="foto2.htm" onfocus="blur();"><img src="punto2.gif" width="60" height="60" border="0" onmouseover="ayuda2.style.visibility='visible';" onmouseout="ayuda2.style.visibility='hidden';"></a></div>


<!------------mensajes de ayuda (también con localización absoluta)------------->


<div id="ayuda1" style="position:absolute;left:30px;top:100px;width:240px;color:rgb(255,100,255);visibility:hidden;"><FONT SIZE="-1" FACE="arial">Aquí­ la ayuda que aparecerí­a al pasar el ratón por el gráfico 1 bla bla bla</font></div>

<div id="ayuda2" style="position:absolute;left:30px;top:100px;width:240px;color:rgb(200,200,0);visibility:hidden;"><FONT SIZE="-1" FACE="arial">Aquí­ la ayuda que aparecerí­a al pasar el ratón por el gráfico 2 bla bla bla</font></div>




Puedes hacer que las fotos también aparezcan sin perder de vista el mapa, poniéndolos igualmente en contenedores (capas) invisibles, como los mensajes, en lugar de ponerlos en una página independiente.