Foros del Web » Programando para Internet » Javascript »

Problema con Slide en JS y el tamaño de las imágenes.

Estas en el tema de Problema con Slide en JS y el tamaño de las imágenes. en el foro de Javascript en Foros del Web. Compañeros, estoy usando un código JS libre para aplicar un slide de imágenes a una web. Cuándo pruebo la imagen con las dimensiones X (ancho= ...
  #1 (permalink)  
Antiguo 01/08/2013, 06:23
Avatar de RAZGRIZ24  
Fecha de Ingreso: septiembre-2009
Mensajes: 143
Antigüedad: 14 años, 7 meses
Puntos: 2
Problema con Slide en JS y el tamaño de las imágenes.

Compañeros, estoy usando un código JS libre para aplicar un slide de imágenes a una web.

Cuándo pruebo la imagen con las dimensiones X (ancho= 99% y alto automático) las imágenes quedan espectaculares. Cuándo las introduzco en una capa "slide" para aplicarle el efecto y al atributo le aplico las mismas medidas, las dimensiones de la imagen se convierten en algo aleatorio, se descuadran y quedan horribles.

¿Me podéis orientar sobre a qué puede deberse?¿Os habéis visto en una situación así antes?
  #2 (permalink)  
Antiguo 01/08/2013, 07:02
Avatar de ipraetoriux  
Fecha de Ingreso: abril-2010
Ubicación: ipraetoriux.com
Mensajes: 1.125
Antigüedad: 14 años
Puntos: 155
Respuesta: Problema con Slide en JS y el tamaño de las imágenes.

...tendrias que poner el JS y el CSS que estas usando...porque usas % para definir el ancho?, es un slide empleado en una web con Responsive Web Design?
  #3 (permalink)  
Antiguo 01/08/2013, 09:53
Avatar de RAZGRIZ24  
Fecha de Ingreso: septiembre-2009
Mensajes: 143
Antigüedad: 14 años, 7 meses
Puntos: 2
Respuesta: Problema con Slide en JS y el tamaño de las imágenes.

Pretendo que lo sea, sí.

Aquí los códigos:

HTML

Código:
<div id="slider" class="div_images">
<img src="imagenes_web/terapias/masaje metamorfico.jpg" width="100%" alt="Reflexología podal" />
<img src="imagenes_web/terapias/acupuntura.jpg" width="100%" alt="Acupuntura" /></div>
CSS específico:

Código:
.div_images {
	font-family: Arial, Helvetica, sans-serif;
	font-size: medium;
	width: 99%;
	text-align: center;
}
JS para id="slider"

Código:
#slider {
	width:99%;
	height:35.31em;/* Make it the same size as your images */
	background:#fff url(loading.gif) no-repeat 50% 50%;
	position:relative;/*make the image slider center-aligned */
	box-shadow: 0px 1px 5px #999999;
	padding: 0px;
	margin: auto;
}

Imágenes SIN JS:




Imágenes CON JS:



Como veis, parece que la imagen se "amplía" dentro de la capa del código, en vez de redimensionarse para adecuarse a ello.

No suelo trabajar con JS, no soy programador y cuándo diseño cositas con pequeñas aplicaciones suelen ser prefabricadas. Por lo que muy probablemente esto sea un error de novato, en cualquier caso; agradeceré vuestra orientación.

¡Muchas gracias!

Etiquetas: js, slide, tamaño
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 08:41.