Como Hacer Que Mi Pagina Se Adapte A La Resolucion De La Pantalla Del Usuario?

Jimito · #1 (**permalink**) 06/11/2003, 20:21

AUXILIO!! Podrían ayudarme? (Quisiera saber si es que se puede hacer) como hacer que mi pagina web se adapte a la resolución de la pantalla del usuario. La resolucion de mi pantalla es 800x600 pero cuando veo mi pagina en una pantalla de 1024x768, todo el texto y el diseño se van para una esquina y el fondo se ve como mosaico. Me dijeron que necesito un Javascript.
Les agradezco mucho si me pueden ayudar.

KarlanKas · #2 (**permalink**) 07/11/2003, 04:10

yo creo que con HTML y CSS se puede arreglar. Pero depende de lo que quieras. Se puede hacer que la página se centre en la pantalla (dejando el fondo negro, por ejemplo, en el resto de la pantalla) o se puede hacer una página para cada resolución (en cuyo caso sí se emplearía un JS) o se puede hacer que la página sea más grande por CSS según la resolución de quien visite la misma.

Pon la URL de tu página y así veremos qué solución es la más adecuada.

Por ejemplo, para hacer una página para cada resolución visita la FAQ 22.

Si quieres centrar la página en la pantalla visita esta página.

Espero uqe te ayude!

Jimito · #3 (**permalink**) 07/11/2003, 09:18

gracias por la informacion pero dime una cosa, no se puede hacer que la pagina que se ve bien por ejemplo en 800x600 se adapte otros tipos de resolucion sin crear paginas para cada una?
te cuento que la pagina que estoy haciendo es para un proyecto pero todavia no tengo URL, me hubiese gustado mucho dartelo para que la veas
el problema es que la pagina tiene una imagen de fondo y se ve como un mosaico cuando la resolucion aumenta

Bluesman74cl · #4 (**permalink**) 07/11/2003, 09:22

Tengo mi fé puesta en que algún día voy a dar con el código de autoajuste, lo tuve en manos y lo perdí....

... en serio existe un código jscript que autoajusta la página de acuerdo a la resolución para evitar el trabajo de hacer distintas adecuaciones mediante HTML.... espero dar con él luego...

Jimito · #5 (**permalink**) 07/11/2003, 09:33

te agradeceria en el alma si puedes conseguir ese script!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!
no sabes como lo necesito!!!!!! si lo tienes escribeme a [email protected] POR FAVOR!!!!

Gpastor · #6 (**permalink**) 07/11/2003, 11:09

Hola Jimito lo que yo hago es detectar la resolución de la pantalla del usuario y ajusto la ventana del navegador, pero solo para una mejor visualización, no es lo mas recomendable para el usuario pero si para el programador porque te soluciona el problema visual o de que tu web quede centrada.
Esto debes poner en el head:
<script language="javascript">
function resolucion(){
if (window.screen){
var w = screen.width;

if(document.all){
if(w >= 740 && w < 835){

window.moveTo(0,0);
if (document.all) {
top.window.resizeTo(screen.availWidth,screen.avail Height);
}
else if (document.layers||document.getElementById) {
if (top.window.outerHeight<screen.availHeight||top.wi ndow.outerWidth<screen.availWidth){
top.window.outerHeight = screen.availHeight;
top.window.outerWidth = screen.availWidth;
}
}
}

if(w >= 835){
window.resizeTo(800,680);
}
}

}
}
</script>
</head>

y en el body:
<body onload="resolucion()" Onresize="window.resizeTo(800,600)>

Ojo que este script solo es para resoluciones de 800*600 y de 1024*768 si deseas cubrir mas resoluciones debes agregar mas script.

Espero que te ayude......

Alexiel · #7 (**permalink**) 07/11/2003, 14:08

Por curiosidad probé este código; y minimiza un diseño que tengo; pero tiene divs y salen en blanco, aparte de que todo sale con efecto alpha algo así como al 40% O__o

CADIZTORRENT · #8 (**permalink**) 03/02/2009, 20:15

Gpastor
PORFAVOR NECESITO PARA MAS RESOLUCIONES
COMO LO AGO
AYUDAME

_pitufo · #9 (**permalink**) 04/02/2009, 04:53

Hace unos días que tengo el mismo problema que el amigo. Sé que se hace con lo de los porcentajes en HTML, pero en este caso las imágenes podrían quedar desproporcionadas o "encajar mal". Lo que yo estoy haciendo es poner el W y H de todas las imagenes al 100% y usar este script, pero estoy teniendo problemas de sintaxis porque es la primera vez que uso javascript:

Código:

function alertSize() {
  var myWidth = 0;
  if( typeof( window.innerWidth ) == 'number' ) {
    //Non-IE
    myWidth = window.innerWidth;
  } else if( document.documentElement && ( document.documentElement.clientWidth ) ) {
    //IE 6+ in 'standards compliant mode'
    myWidth = document.documentElement.clientWidth;
  } else if( document.body && ( document.body.clientWidth ) ) {
    //IE 4 compatible
    myWidth = document.body.clientWidth;
  }
}

function tabla() {
	var A = 125, B = 142, C = 109, D = 140, E = 104, F = 136, G = 119, H = 125;
	var I = 132, J = 337, K = 57, L = 19, M = 17, N = 18, O = 20;
	var myHeight = myWidth*0.6;
	var helpWidth = myWidth/1000, helpHeigth = myHeight/600;
	if( myWidth!=1000 && myWidth>800 ) {
	A = A*helpWidth; B = B*helpWidth; C = C*helpWidth; D = D*helpWidth; E = E*helpWidth; F = F*helpWidth; G = G*helpWidth; H = H*helpWidth;
	I = I*helpHeight; J = J*helpHeight; K = K*helpHeight; L = L*helpHeight; M = M*helpHeight; N = N*helpHeight; O = O*helpHeight;
	}
	else if( myWidth<=800 ) {
	myWidth=800;
	myHeight = myWidth*0.6;
	helpWidth = myWidth/1000; helpHeigth = myHeight/600;
	A = A*helpWidth; B = B*helpWidth; C = C*helpWidth; D = D*helpWidth; E = E*helpWidth; F = F*helpWidth; G = G*helpWidth; H = H*helpWidth;
	I = I*helpHeight; J = J*helpHeight; K = K*helpHeight; L = L*helpHeight; M = M*helpHeight; N = N*helpHeight; O = O*helpHeight;
	}
	else{}
}

La primera función la encontre en una página y es para detectar el tamaño de la ventanta. La resolucion "inicial" de mi pagina es de 1000*600 (vaya uno a saber por qué). La segunda calcula los valores de los W y H con una simple regla de tres en el caso de que la ventana no sea menor a 800*600.
A,B,C... son los anchos de las columnas e I,J,K... las alturas de las filas.
Lo que no se como hacer es asignar esas variables a los W y H 's de la tabla.

Probe algo como: <tr Heigth=&{I}>, pero como dije no se como es la sintaxis. Me ayudaría mucho que alguien me la enseñe, o que me digan si encuentran algun error en el script que puse.