Foros del Web » Creando para Internet » CSS »

imagenes

Estas en el tema de imagenes en el foro de CSS en Foros del Web. se puede poner imagenes en forma de links y que al pasar el mouse aparezca un borde en la imagen, o solo se puede con ...
  #1 (permalink)  
Antiguo 25/01/2004, 16:59
Avatar de dexter_x740  
Fecha de Ingreso: julio-2003
Ubicación: cd. obregon, Sonora
Mensajes: 246
Antigüedad: 14 años, 4 meses
Puntos: 1
imagenes

se puede poner imagenes en forma de links y que al pasar el mouse aparezca un borde en la imagen, o solo se puede con javascript?
  #2 (permalink)  
Antiguo 25/01/2004, 17:11
Avatar de caricatos
Moderador
 
Fecha de Ingreso: abril-2002
Ubicación: Torremolinos (Málaga)
Mensajes: 19.544
Antigüedad: 15 años, 8 meses
Puntos: 1262
Hola dexter_x740:

Dentro de un link puedes poner una imágen:

<a href=tu_Link><img src=tu_Imagen /></a>

También puedes conseguir el efecto con javascript y estilos:
<img src=tu_Imagen onmouseover="this.style.borderWidth = 1"
onmouseout="this.style.borderWidth = 0" style="cursor:pointer" />

Saludos
  #3 (permalink)  
Antiguo 25/01/2004, 17:19
Avatar de dexter_x740  
Fecha de Ingreso: julio-2003
Ubicación: cd. obregon, Sonora
Mensajes: 246
Antigüedad: 14 años, 4 meses
Puntos: 1
ok, pero mi pregunta era que si es posible definirlo en el style mediante css para que todas las imagenes tengan el mismo efecto.
  #4 (permalink)  
Antiguo 26/01/2004, 02:03
Avatar de caricatos
Moderador
 
Fecha de Ingreso: abril-2002
Ubicación: Torremolinos (Málaga)
Mensajes: 19.544
Antigüedad: 15 años, 8 meses
Puntos: 1262
Hola otra vez:

Para explorer hay algo que puede servirte: "behavior" (creo que significa comportamiento), pero no es estándar y tendrías que implementar algo para el resto de navegadores en javascript, así que supongo que mejor sería hacerlo directamente en javascript:

for (var i = 0; i < document.images.length; i ++) {
document.images[i].onmouseover = this.style.borderWidth = "1px";
document.images[i].onmouseout = this.style.borderWidth = "0px";
document.images[i].style.cursor = "pointer";
}

Si tuvieras otra definición para onmouseover/out de esta manera se perdería y tendrías que usar addEventListener (DOM estándar) o attachEvent (explorer), pero sería complicarte las cosas y no creo que sea necesario.

Saludos
  #5 (permalink)  
Antiguo 26/01/2004, 07:27
 
Fecha de Ingreso: enero-2004
Mensajes: 35
Antigüedad: 13 años, 10 meses
Puntos: 0
>>>…se puede poner imagenes en forma de links…

Es la única manera para que funcione en todo los navegadores. Tienes que poner tus img adentro de los <a>nchors. En tus estilos:

a:hover {border: 1px solid #000000;}
  #6 (permalink)  
Antiguo 26/01/2004, 13:28
 
Fecha de Ingreso: agosto-2003
Mensajes: 499
Antigüedad: 14 años, 3 meses
Puntos: 1
img:hover {border:1px dolid red;}

Funciona en todos los navegadores buenos que respetan las normas.
__________________
Plaza Mozilla
http://www.chevrel.org/es/noticias/
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 01:10.