Foros del Web » Creando para Internet » CSS »

"Efecto" Pop-Up

Estas en el tema de "Efecto" Pop-Up en el foro de CSS en Foros del Web. Hola que tal maestros, me encontraba navegando buscando algo para hacer un efecto pop up con una imagen y me encontre con esto... http://moneytreesystems.com/css/picpopup.html Alguien ...
  #1 (permalink)  
Antiguo 06/03/2008, 14:39
 
Fecha de Ingreso: diciembre-2007
Ubicación: Frente al ordenador...
Mensajes: 139
Antigüedad: 10 años
Puntos: 1
"Efecto" Pop-Up

Hola que tal maestros, me encontraba navegando buscando algo para hacer un efecto pop up con una imagen y me encontre con esto...

http://moneytreesystems.com/css/picpopup.html

Alguien me pudiera explicar eso...sobre todo la parte de la class:large...
y además como pudiera utilizar esta técnica dentro de un mapa de imágenes...

Muchas Gracias...
__________________
----------------------------------------------------------
Algunas cosas simplemente son bellas...por que uno no puede tenerlas...
  #2 (permalink)  
Antiguo 06/03/2008, 14:55
Avatar de lucasan
Colaborador
 
Fecha de Ingreso: junio-2007
Ubicación: Cali - Colombia
Mensajes: 1.144
Antigüedad: 10 años, 6 meses
Puntos: 59
Re: "Efecto" Pop-Up

Según lo que veo, esconde la imagen a un tamaño de 1 px y la pone fuera de la vista (po reso la posiciona a -1px) y al pasar por encima (hover) la posiciona donde desea y le da el tamaño real.

Bastante creativo.
__________________
Plan Original Desarrollo Web
~$>sudo apt-get install -f
"Asi debería arreglarse todo en la vida"
  #3 (permalink)  
Antiguo 06/03/2008, 15:37
 
Fecha de Ingreso: diciembre-2007
Ubicación: Frente al ordenador...
Mensajes: 139
Antigüedad: 10 años
Puntos: 1
Re: "Efecto" Pop-Up

Gracias lucasan, ya mas o menos le entendí...
otra cosa, quería utilizar esta técnica en un mapa de imágenes pero no pude...a lo que va mi pregunta es que si map o area tienen una propiedad hover??
por que si no es así tons no se como poder utilizarlo...yo digo que si se puede...
gracias...
__________________
----------------------------------------------------------
Algunas cosas simplemente son bellas...por que uno no puede tenerlas...
  #4 (permalink)  
Antiguo 06/03/2008, 17:03
Avatar de lucasan
Colaborador
 
Fecha de Ingreso: junio-2007
Ubicación: Cali - Colombia
Mensajes: 1.144
Antigüedad: 10 años, 6 meses
Puntos: 59
Re: "Efecto" Pop-Up

La verdad no se mucho de mapa de imagenes, yo cree uno pero no de la manera convencional, echale un vistazo aqui http://ventoacoustic.com/tiendas cuando das click en cada ciudad te sale una ventana, pero igual podrías hacer que te salga una capa descriptiva.

Te lo resumo, lo que hice fue:

Código HTML:
<span class="loquesea"><a href="http://laurl">texto o imagen</a></span> 
Y esa clase .loquesea le doy position: absolute; y la posicioné donde lo necesitaba.

En mi caso necesitaba el vínculo, y a la etiqueta <a></a> le puedes poner un a:hover

No se si sea la mejor manera de hacerlo, pero me solucionó mi caso específico.

Saludos, y cualquier cosa preguntas.
__________________
Plan Original Desarrollo Web
~$>sudo apt-get install -f
"Asi debería arreglarse todo en la vida"
  #5 (permalink)  
Antiguo 07/03/2008, 13:00
 
Fecha de Ingreso: diciembre-2007
Ubicación: Frente al ordenador...
Mensajes: 139
Antigüedad: 10 años
Puntos: 1
Re: "Efecto" Pop-Up

lucasan ya te entendí perfectamente...y ya se como hacero...solo que quisiera un consejo para que sea optimo...hice mas o menos lo que tu hiciste...
solo que en lugar de spans, coloco primero divs...haciando la función que hacen los maps...y luego ya coloco los spans...pero como son 13 imágenes y de diferentes tamaños... tengo ke hacer varias hojas de estilo o todos los meto en una??
__________________
----------------------------------------------------------
Algunas cosas simplemente son bellas...por que uno no puede tenerlas...
  #6 (permalink)  
Antiguo 07/03/2008, 16:24
Avatar de lucasan
Colaborador
 
Fecha de Ingreso: junio-2007
Ubicación: Cali - Colombia
Mensajes: 1.144
Antigüedad: 10 años, 6 meses
Puntos: 59
Re: "Efecto" Pop-Up

Definitivamente usa una sola hoja de estilos, al usar mas gastas mas tiemp de carga de tu página etc...

En una sola hoja puedes poner todo, solo comentalo para que no te confundas.

Ej.

Código:
/* COMIENZA EL MAPA */
tu codigo css


/*TERMINA EL MAPA */
Es mas por orden, y para que reuses o puedas mejorar después tu código.

Saludos.
__________________
Plan Original Desarrollo Web
~$>sudo apt-get install -f
"Asi debería arreglarse todo en la vida"
  #7 (permalink)  
Antiguo 25/03/2008, 13:31
(Desactivado)
 
Fecha de Ingreso: noviembre-2002
Ubicación: Ciudad Autónoma de Buenos Aires
Mensajes: 2.367
Antigüedad: 15 años, 1 mes
Puntos: 317
Re: "Efecto" Pop-Up

Acá hay otros ejemplos con mapas

Zoom en una imagen

Crear mapa con imagenes?

Aplicar filtro o similar sobre un elemento SHAPE de una imagen
Atención: Estás leyendo un tema que no tiene actividad desde hace más de 6 MESES, te recomendamos abrir un Nuevo tema en lugar de responder al actual.
Respuesta

SíEste tema le ha gustado a 1 personas




La zona horaria es GMT -6. Ahora son las 16:48.