Foros del Web » Creando para Internet » CSS »

Css image map

Estas en el tema de Css image map en el foro de CSS en Foros del Web. Saludos, Quiciera saber como emplear mapa de imagenes mediante aplicaciones de CSS. Tengo unos campos <div> los cuales hacen referencia a estructuras de imagenes que ...
  #1 (permalink)  
Antiguo 22/01/2008, 13:53
Avatar de wolf777  
Fecha de Ingreso: junio-2004
Ubicación: Bolivia
Mensajes: 199
Antigüedad: 13 años, 6 meses
Puntos: 0
Css image map

Saludos,

Quiciera saber como emplear mapa de imagenes mediante aplicaciones de CSS.
Tengo unos campos <div> los cuales hacen referencia a estructuras de imagenes que estan en la parte CSS como background.

Quiciera poder aplicar algunos links a ciertos puntos especificos de ese background y luego proceder con otra aplicaciones javascript.

Pero necesito inicialmente dominar la parte de CSS donde coloco esos links como mapa de imagenes.

Si alguien sabe de algun tutorial completo o tenga una explicacion le agradeceria mucho.

Agradezco de antemano su atencion.

Nota: Disculpen los moderadores, si este es un tema que ya se consulto.
__________________
Do not let The Darknness Get You, to soon...
  #2 (permalink)  
Antiguo 22/01/2008, 14:09
Avatar de McBlink  
Fecha de Ingreso: noviembre-2006
Ubicación: $ARG->LaPampa()
Mensajes: 1.694
Antigüedad: 11 años, 1 mes
Puntos: 22
Re: Css image map

Con el Dreamweaver es muy facil hacerlo,
vas a mapa de imagenes, seleccionas la forma quq quieras, ya sea poligonal cuadrada o la que sea..
y pones el link y listo ;)

saludos!
MC
__________________
Recuerda usar el highlight para mostrar código
mauricioblint.com
  #3 (permalink)  
Antiguo 22/01/2008, 14:34
Avatar de wolf777  
Fecha de Ingreso: junio-2004
Ubicación: Bolivia
Mensajes: 199
Antigüedad: 13 años, 6 meses
Puntos: 0
Re: Css image map

Si pero no es el mapa de imagenes normal que creo que te refieres.. sino a unomediante el uso de etiquetas <dd> etc etc etc...
__________________
Do not let The Darknness Get You, to soon...
  #4 (permalink)  
Antiguo 23/01/2008, 01:00
Avatar de caricatos
Moderador
 
Fecha de Ingreso: abril-2002
Ubicación: Torremolinos (Málaga)
Mensajes: 19.547
Antigüedad: 15 años, 8 meses
Puntos: 1262
Re: Css image map

Hola:

No recuerdo que con css se pudiera crear mapas o similar... si sabes de algún enlace muéstranoslo.

Saludos
__________________
Por favor:
No hagan preguntas de temas de foros en mensajes privados... no las respondo
  #5 (permalink)  
Antiguo 23/01/2008, 04:11
Avatar de McBlink  
Fecha de Ingreso: noviembre-2006
Ubicación: $ARG->LaPampa()
Mensajes: 1.694
Antigüedad: 11 años, 1 mes
Puntos: 22
Re: Css image map

Cita:
Iniciado por caricatos Ver Mensaje
Hola:

No recuerdo que con css se pudiera crear mapas o similar... si sabes de algún enlace muéstranoslo.

Saludos
Yo tampoco lo sobia..
esperemos haber que dice

Saludos.
__________________
Recuerda usar el highlight para mostrar código
mauricioblint.com
  #6 (permalink)  
Antiguo 28/01/2008, 14:55
Avatar de wolf777  
Fecha de Ingreso: junio-2004
Ubicación: Bolivia
Mensajes: 199
Antigüedad: 13 años, 6 meses
Puntos: 0
Re: Css image map

Saludos

Claro que si se llama Css Image Mapping, evidentemente no es con las etiquetas clasicas de DHTML sino mediante la aplicacion de Css que es basica para el empleo de menus desplegables.

Por suerte ya encontre como se hacia eso, y solucione mi problema les envio una pequeña aplicacion medinate Css image mapping.

http://www.frankmanno.com/ideas/css-imagemap/
(Este link da ejemplos claros de utilización)

CSS:
Cita:
dd#homeDef{
top: 83px;
left: -140px;
position:absolute;
}
dd#homeDef a{
position: absolute;
width: 180px;
height: 70px;
text-decoration: none;
border: 0px solid #FFFCE6;
background: transparent url(../images/bg_menu_000.png) repeat;
}
dd#homeDef a span{
display: none;
}
dd#homeDef a:hover{
background: transparent url(hover.png) repeat;
border: 0px solid #FFFCE6;
}
dd#homeDef a:hover span{
display: block;
text-indent: 0;
vertical-align: top;
color: #f8b5f5;
font-family:"Papyrus","Verdana","Monotype Corsiva";
font-weight: bold;
font-size:25px;
position: absolute;
border: 0px solid #f8b5f5;
bottom: 20px;
left:200px;
margin: 0;
padding: 5px;
width: 100px;
}
HTML:
Cita:
<dl id="lotusMap">
<dd id="homeDef">
<a href="#" onmouseover="javascript:link_menu_001()" onmouseout="javascript:link_menu()">
<span>Home</span></a>
</dd></dl>
Espero que sea utiles para ustedes como lo fue para mí ;) Adios y gracias.
__________________
Do not let The Darknness Get You, to soon...
  #7 (permalink)  
Antiguo 28/01/2008, 14:56
Avatar de wolf777  
Fecha de Ingreso: junio-2004
Ubicación: Bolivia
Mensajes: 199
Antigüedad: 13 años, 6 meses
Puntos: 0
Re: Css image map

Porciacazo me olvide decirles, el javascript lo pueden obviar. Esa fue parte necesaria en el otro sistema que realice.

Adios
__________________
Do not let The Darknness Get You, to soon...
  #8 (permalink)  
Antiguo 28/01/2008, 15:48
Avatar de McBlink  
Fecha de Ingreso: noviembre-2006
Ubicación: $ARG->LaPampa()
Mensajes: 1.694
Antigüedad: 11 años, 1 mes
Puntos: 22
Re: Css image map

Muy muy interesante..
la verdad.. no lo conocia..

Saludos!
MC
__________________
Recuerda usar el highlight para mostrar código
mauricioblint.com
  #9 (permalink)  
Antiguo 30/01/2008, 02:22
Avatar de caricatos
Moderador
 
Fecha de Ingreso: abril-2002
Ubicación: Torremolinos (Málaga)
Mensajes: 19.547
Antigüedad: 15 años, 8 meses
Puntos: 1262
Re: Css image map

Cita:
Iniciado por wolf777 Ver Mensaje
Saludos

Claro que si se llama Css Image Mapping...
Hola:

El link ya lo conocía y sin duda es interesante, pero no se trata de un "mapa", ya que funciona solo sobre cajas (capas/enlaces). Yo diría que es un rollover mejorado.

Saludos
__________________
Por favor:
No hagan preguntas de temas de foros en mensajes privados... no las respondo
  #10 (permalink)  
Antiguo 11/02/2008, 15:18
Avatar de wolf777  
Fecha de Ingreso: junio-2004
Ubicación: Bolivia
Mensajes: 199
Antigüedad: 13 años, 6 meses
Puntos: 0
Re: Css image map

Sinceramente creo que tienes mucha razon Caricatos, pero segun vi se lo llama de esa forma generalmente "css image map" aunque como tu menciones sera solo un roll over mejorado en lo cual estoy muy deacuerdo contigo.

Saludos
__________________
Do not let The Darknness Get You, to soon...
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




La zona horaria es GMT -6. Ahora son las 11:25.