Foros del Web » Programando para Internet » Javascript »

Centrar una imagen mayor a la resolucion de la pantalla

Estas en el tema de Centrar una imagen mayor a la resolucion de la pantalla en el foro de Javascript en Foros del Web. tengo una imagen superior a 1280 y cuando la resolucion de la pantalla sea menor esta imagen debe aparecer centrada. he desarrollado un codigo que ...
  #1 (permalink)  
Antiguo 08/11/2004, 11:47
 
Fecha de Ingreso: julio-2003
Mensajes: 95
Antigüedad: 20 años, 9 meses
Puntos: 0
Centrar una imagen mayor a la resolucion de la pantalla

tengo una imagen superior a 1280 y cuando la resolucion de la pantalla sea menor esta imagen debe aparecer centrada.
he desarrollado un codigo que funciona bien en IE6 pero no en Opera ni en Javascript
paso a explicarles a ver si a alguno se le ocurre que estoy haciendo mal


Se tiene 3 frame: uno superior, medio e inferior
<frameset rows="*,410,*" frameborder="NO" border="0" framespacing="0">
<frame src="top.html" name="topFrame" scrolling="NO" noresize>
<frame src="home.html" name="center" noresize frameborder="no" scrolling="no" marginwidth="0" marginheight="0">
<frame src="bottom.html" noresize frameborder="no" scrolling="no" marginwidth="0" marginheight="0">
</frameset>

el mas importante es el medio "center"
En center se tiene una tabla dividida en dos filas
la primera fila tiene 4 celdas dinamicas
<tr >
<td height="1" align="right" id="uno"><a target="_self" name="center2"><img src="spacer.gif"></a></td>
<td height="1" id="dos"></td>
<td height="1" id="tres"></td>
<td height="1" align="left" id="cuatro"><a name="center"><img src="spacer.gif"></a></td>
</tr>

y la segunda fila un colspan = "4" y la imagen de 1300px

en el parent tengo el siguiente codigo para centrar la imagen segun el tamaño de la ventana

var a,width,r,a_old;
window.onresize=center1
window.onload = center1
function center1(){

// determinar el tamaño de la ventana
var a = window.document.body.scrollWidth; //frames['center'].document.body
if(a==0 || a=="") {a = window.innerWidth;}
if(a != a_old ){
a_old = a;
if(a<=1280){
width = parseInt(a)/2;
r = 640 - parseInt(width);
window.frames['center'].document.getElementById('uno').width = r+1;
window.frames['center'].document.getElementById('dos').width = parseInt(width)-1;
window.frames['center'].document.getElementById('tres').width = parseInt(width)-1;//cell_right
window.frames['center'].document.getElementById('cuatro').width = r+1;
window.frames('center').location.hash ="#center";
window.frames('center').location.hash ="#center2";
}
}
}

espero que entiendan y me puedan dar una mano
  #2 (permalink)  
Antiguo 08/11/2004, 13:04
Avatar de tunait
Moderadora
 
Fecha de Ingreso: agosto-2001
Ubicación: Terok Nor
Mensajes: 16.805
Antigüedad: 22 años, 8 meses
Puntos: 381
Hola halconhalcon,

Oye una cosa, yá que la imagen está dentro de un contenedor (una celda) por qué no le asignas una anchura en porcentaje?? No le asignes la propiedad height, y le asignas el width en porcentaje. Eso la adaptará en cada resize o resolución y al no tener height asignado lo hará proporcional a su anchura
  #3 (permalink)  
Antiguo 08/11/2004, 14:16
 
Fecha de Ingreso: julio-2003
Mensajes: 95
Antigüedad: 20 años, 9 meses
Puntos: 0
Centrar imagen mayor a la resolucion de la pantalla

Perdon pero la idea es
que la imagen se mantenga siempre del mismo tamaño no resize
en verdad es un objeto de flash.
y la imagen de ancho mide 1280 y el problema se da cuando quiero ver en una resolucion de 800 el objeto no queda centrado en la ventana
es por eso que uso la funcion
lo que realiza es centrar a la izquierda y luego a la derecha

y el problema es que en Opera y Netscape no me funciona esta funcion

"#center" son dos anclas
window.frames('center').location.hash ="#center";
window.frames('center').location.hash ="#center2";
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:20.