onMouseover show un layer y lo posiciono (top, left), como?

por cierto, me dejé algo de mierda en el codigo, la funcion muestrame puedes empezarla asi:

<code>function muestrame(){
// obtenemos el id del link sobre el cual queremos trabajar:
lyr = this.id;
....</code>

Es decir, quitando la e que iba como argumento de la funcion y la primera linea.

mola, me alegro que te guste.

(probado con exito en opera7/mozilla1.4/ie6)

Ya me pasaras el link a la web cuando este rulando, ese diseño tiene muy buena pinta.

genial!

muchas gracias meddle

sois unos mostruos
gracias a todos

voy a aplicarlo ahora mismo...

bueno, bueno, me voy a ronrojar... :P

Jejejeje, k nivel Maribel!!

JEJE, Sergio, ya te dije que tenías suerte de que meddle se metiera en el asunto

:D

alla va, he tardado porque estaba intentando mezclar eventos DOM con eventos HTML y en algun punto la he cagao de lleno. Cosas del IE. Bueno, alla vamos:

http://meddle.dzygn.com/others/mapa/

He asumido que cada thumbnail va a mostrar informacion de su localizacion (mouseover/out) pero a la vez se podra hacer click para llevar a otra pagina o a la imagen en grande, por ejemplo. Por eso no me he cargado el elemento enlace y he trabajado sobre los a en lugar de sobre las imagenes.

Explicacion de como se usa:
Simplemente añades cada thumbnail con la siguiente estructura:
<code>&lt;a href="223_50.jpg" id="thumb_223_50"&gt;&lt;img src="mill-01_p.jpg" width="46" height="46" border="0"&gt;&lt;/a&gt;</code>
href: apunta a la imagen que quieres ampliar o a un html o lo que quieras.
id: ahi esta lo bueno. Debes poner "thumb_" seguido de dos numeros. Essos son la x/y de la posiccion del punto rojo en el mapa. Como eso lo vas a construir a partir de una bbdd pues no tendras problemas.

Como ves se construyen los efectos automaticamente, asi el html queda limpio. Ahi esta la elegancia que decia antes, pues separa estructura de comportamiento. Si el navegador no acepta ese codigo no se ejecuta, pero sigues pudiendo ejecutar el href, que es lo basico.

Si me apuras, incluso te aconsejaria matar la tabla (puedes hacer eso sin tablas) y el mapa y el punto, añadiendolos al vuelo si el navegador acepta dhtml/DOM. Si no lo acepta seguirias teniendo los thumbs y pudiendo acceder a la pagina/imagen ampliada.

Dime que tal.

thnnks por la explicacion sergi, no lo habia utilizao en la vida, hare pruebecillas a ver k tal va.

por cierto en http://www.cross-browser.com hay otra API, supongo k ya la conocias pero por siacaso la posteo.

saludos

display sirve para especificar como debe mostrarse un bloque. las opciones son none (no se muestra), block (tipo bloque) o inline (en linea). Se puede por ejemplo forzar un elemento de bloque a que sea inline (menus a partir de listas, por ejemplo) o al reves.

La diferencia entre visibility:hidden y display:none es que la ultima no guarda el espacio que ocupa el elemento en la pagina. Es lo que usarias por ejemplo para tener bloques de informacion adicional o extra en un weblog que solo quieres mostrar cuando le das a un enlace, automaticamente apareceria el texto y todo lo demas bajaria a partir de ahi.

A lo largo del tiempo me he dado cuenta que al programar dhtml es mejor usar display que visibility por diversas razones que no sabria resumir y que no vienen al caso.

una pregunta sobre la marcha, para que sirve exactamente la propiedad 'display' ??

un saludo

mira de momento me reservo la opcion elegante, tengo un problema con los eventos js y quiero afinar mas. Puedes sustituir las funciones que tenias de macromedia poor estas y cambiar los onmouseover / onmouseout a lo siguiente:

<code>function muestrame(x,y){
// mostramos el punto de señalizacion:
document.getElementById("punto").style.left = x + "px";
document.getElementById("punto").style.top = y + "px";
document.getElementById("punto").style.display = "block";
}

function esconde(){
// escondemos el punto de señalizacion:
document.getElementById("punto").style.display = "none";
}
</code>

cambia tambien el estilo de la capa punto, donde pone visibility:hidden debes poner display:none

Luego te paso la opcion elegante

te vas a cagar, dame 10 minutos mas ;)

perdon de nuevo, no habia leido correctamente

IE5 y NS6

es donde se va a ver
podemos pasar de los del 4 tranquilamente
y pasar a la opcion MUY elgante.

Ten en cuenta Sergio que esta hablando de IE y Ns versión 4! ... no de las últimas.

Yo soy un fan de los estandares y la compatibilidad, y paso de NS4 como de comer mierda, porque era un navegador pésimo, y su soporte CSS lamentable.

Yo inicio la cuenta en IE5 y NS6

no, problemas no, solo que te ahorras codigo. yo personalmente paso de ns4 y ie4, pero eso depende de cada uno o del cliente, etc.

ahora te envio algo, dame 10 minutos.

problemas con NS4?... :)

seria interesante ver como se hace para los dos, pero vale si solo funciona en IE4+ ya que otras partes del web no valen para ns4

solamente otra pregunta. ¿estas seguro que quieres soporte para ie4 y ns4? Lo digo porque si te olvidas de ellos reducimos el codigo un huevo y ademas lo podemos hacer MUY elegantemente, ya veras...

gracias sgiraldo
eso que has hecho es exactamente lo que pretendia

pero estoy con meddle en que es un chorizo de JS bastante potente para solo utilizar una parte muy pequeña...

hombre... para hacer esto.. se podría hacer sin cargar toda la dynapi.
Es como hacer simples botones con cambio en rollover mediante Flash, cuando se puede hacer con html.

sss,
la dynapi estaba muy bien hace 4 años para muchas cosas, pero ahora es obsoleta (opinion personal) y usar una api para lo que tu quieres es del todo exagerado.

te voy a preparar algo mas sencillo, que sea incluso automatico en cuanto a configuracion, ahora te cuento.

hola de nuevo sss,

mira, he aprovechado que no tenia ahora mismo curro y te he creado la página esa utilizando la dynlayer (por si no te aclaras con la web)

http://www.sgiraldo.com/zwork/prueba_sss.htm

Ya me dirás si era esto o no

De todas formas Sergio, asi a bote pronto ¿lo que hace esa función de DW es mostrar / ocultar una capa, no?.

Si buscas esa solución lo que tendrías que hacer es tener tantos DIVs de puntos como fotos, y que cada rollover escondiese uno y mostrase otro.

Yo lo planteo de otra forma, tienes un solo DIV con el punto y lo mueves de sitio.
Tienes que quitar la funcion del rollover y meter la de ponPunto (o lo que hayas adaptado) que te mande.

No te preocupes Sergio, si no está mal, yo también las utilizo para algunas cosas que se me hacen pesadas.

Ahora en el curro no te pudo mirar tranquilamente eso, esta tarde a ver si le puedo echar un ojo.

bueeno
no seais duros conmigo soy un simple diseñador

me siento incapaz de hacer algo en JS desde cero
asi que los scripts de DW me parecen ok
si no tengo nada mejor

asi que me miraré esos de Steinman
gracias sgiraldo

quizas por esto mezclo tablas y divs (es pecado? :) )
me parece que en la pag, aparte de lo de los JS, el planteamiento de un div incrustado en una celda que señala una posicion del mapa que esta como img background es secillote y funciona.

asi escalo la ventana y se mueve todo el pack, la imagen del mapa no da la brasa desplazando el div a no se sabe ande...

gracias a todos

yo recomiendo para DHTML las librerias DynDuo de Dan Steinman
http://www.dansteinman.com/dynduo/

JEJE, has triunfado Sergio, Meddle es un crack del DHTML
:D

Me miro las funciones que has puesto y te respondo
(te advierto que creo que sería mejor olvidarte de las de Macromedia y programar las tuyas propias)

.

ok, ahi va un link

http://www.fechevarria.org/pruebas/pagina.htm

.

¿he oido divs+tablas? aclaranos ese punto. mejor aun, ¿tienes una pagina colgada para que la veamos y le añadamos el js?

gracias orange
pero no logro que funcione eso...
estoy hecho un paquete o por que no lo entiendo o porque no me explico.

aclaremos un poco mas
por un lado:

.. a href ... onMouseOver="MM_showHideLayers('punto','','show')" onMouseOut="MM_showHideLayers('punto','','hide')" ... imagen1.gif.. ... /a

.. a href ... onMouseOver="MM_showHideLayers('punto','','show')" onMouseOut="MM_showHideLayers('punto','','hide')" ...imagen2.gif.. .../a

por otro (en una tabla distinta al otro lado de la pag)

&lt;td&gt;
&lt;div id="punto" style="position:relative; width: 6px; height: 6px; left:???px; top:???px; visibility: hidden;" ...imgpunto.gif... &lt;/div&gt;
&lt;/td&gt;

pregunta:
como pasando el raton por la imagen1 hago que el div"punto" se ponga en una posicion (por ej. 100,300) y por pasando por la imagen2 que el div"punto" se ponga en otra posicion (por ej. 200,400)

mas concretamente:
como el onMouseOver de la imagen1 puede mandar al div"punto" colocarse en un sitio concreto (100,300)y el onMouseOver de la imagen2 en otro (200,400).

a ver si ya lo he explicado bien...

joder borja !!,

de crack !! ;)