Problema con resolución de pantalla
Me gustaría saber que solución puedo tener para que mi diseño se vea bien en resoluciones de 800 x 600 y 1024. Sin tener que redireccionar con el código de javascript. Osea que exista un script dentro de la página que haga que el diseño cambie cuando se modifica la resolución de pantalla sin tener que redireccionar - gracias - Bruno
1 Respuesta
Respuesta de monodrack
1
Pues mira, lo que puedes hacer es crearte un sitio a base de tablas que funcionen en pocerntajes en vez de que utilices pixeles, a modo que sea 100% en ambas resoluciones.
El problema sería si meter imágenes de fondo, pues tendrás que crearte imágenes de fondo que sean del mínimo en la resolución de 1024, y en 800x600 se vería una sección de la imagen.
Existe un código Javascript (que aun no encuentro, pero me han platicado que existe dentro de la web http://www.javascripts.com) que hace que el contenido se ajuste, el problema es que al tratarse de un ajuste, las imágenes se distorsionarán si la hiciste originalmente para 800x600 o 1024... De cualquier modo, el resultado es la distorsión del sitio.
La única aplicación que ha solucionado este problema es Macromedia Flash MX 2004, que permite hacer que tus animaciones (si haces un sitio flash que abarque toda la pantalla) se ajusten al colocarles 100% por 100% al limite de la película en vez de utilizar pixeles, y generalmente se diseña para resoluciones grandes, de modo que al ajustarse a una resolución pequeña, el reproductor de Macromedia Flash 7.0 hace que la imagen no se distorsione.
Bueno, son solo consejos, espero que te puedan ayudar, visitate la web esa de javascripts.com o busca por "javascript" dentro de todos los buscadores y en las webs de javascripts encontrarás el código que ajusta, si es que lo deseas.
El problema sería si meter imágenes de fondo, pues tendrás que crearte imágenes de fondo que sean del mínimo en la resolución de 1024, y en 800x600 se vería una sección de la imagen.
Existe un código Javascript (que aun no encuentro, pero me han platicado que existe dentro de la web http://www.javascripts.com) que hace que el contenido se ajuste, el problema es que al tratarse de un ajuste, las imágenes se distorsionarán si la hiciste originalmente para 800x600 o 1024... De cualquier modo, el resultado es la distorsión del sitio.
La única aplicación que ha solucionado este problema es Macromedia Flash MX 2004, que permite hacer que tus animaciones (si haces un sitio flash que abarque toda la pantalla) se ajusten al colocarles 100% por 100% al limite de la película en vez de utilizar pixeles, y generalmente se diseña para resoluciones grandes, de modo que al ajustarse a una resolución pequeña, el reproductor de Macromedia Flash 7.0 hace que la imagen no se distorsione.
Bueno, son solo consejos, espero que te puedan ayudar, visitate la web esa de javascripts.com o busca por "javascript" dentro de todos los buscadores y en las webs de javascripts encontrarás el código que ajusta, si es que lo deseas.
Aquí tienes el script en javascript que te permitirá realizar esos cambios en tu página web.
<!--
1. Copia el codigo dentro de la etiqueta HEAD de tu documento HTML -->
<HEAD>
<!-- Establece resolucion para usuarios de Netscape a 800 x 600 -->
<link rel="stylesheet" type="text/css" href="netscape.css">
<!-- Establece resolucion para usuarios de IExplorer -->
<SCRIPT LANGUAGE="JavaScript">
<!-- Original: Blackprince (todoexpertos) ([email protected]) -->
<!-- WebSite:http://www.pc-click.com.mx -->
<!-- Begin
//document.write('Tu resolucion es ' + screen.width + ' x ' + screen.height + '');
if (screen.width == 640) {
document.write('<link rel="stylesheet" type="text/css" href="640.css">');
//alert("Resolucion en 640 x 480 Deberia ser llamado");
}
if (screen.width == 800) {
document.write('<link rel="stylesheet" type="text/css" href="800.css">');
//alert("Resolucion en 800 x 600 deberia ser llamado");
}
if (screen.width == 1024) {
document.write('<link rel="stylesheet" type="text/css" href="1024.css">');
//alert("Resolucion en 1024 x 768 Deberia ser llamado");
}
if (screen.width == 1280) {
document.write('<link rel="stylesheet" type="text/css" href="1280.css">');
//alert("Resolcuion en 1280 x 960 Deberia ser llamado");
}
if (screen.width == 1600) {
document.write('<link rel="stylesheet" type="text/css" href="1600.css">');
//alert("Resoilucion en 1600 x 1200 Deberia ser llamado.");
}
// End -->
</script>
<!-- Tamaño de Script : 1.74 KB -->
Esto es todo... espero haberte ayudado amigo y no te olvides de puntuarme bien ehh ;)
<!--
1. Copia el codigo dentro de la etiqueta HEAD de tu documento HTML -->
<HEAD>
<!-- Establece resolucion para usuarios de Netscape a 800 x 600 -->
<link rel="stylesheet" type="text/css" href="netscape.css">
<!-- Establece resolucion para usuarios de IExplorer -->
<SCRIPT LANGUAGE="JavaScript">
<!-- Original: Blackprince (todoexpertos) ([email protected]) -->
<!-- WebSite:http://www.pc-click.com.mx -->
<!-- Begin
//document.write('Tu resolucion es ' + screen.width + ' x ' + screen.height + '');
if (screen.width == 640) {
document.write('<link rel="stylesheet" type="text/css" href="640.css">');
//alert("Resolucion en 640 x 480 Deberia ser llamado");
}
if (screen.width == 800) {
document.write('<link rel="stylesheet" type="text/css" href="800.css">');
//alert("Resolucion en 800 x 600 deberia ser llamado");
}
if (screen.width == 1024) {
document.write('<link rel="stylesheet" type="text/css" href="1024.css">');
//alert("Resolucion en 1024 x 768 Deberia ser llamado");
}
if (screen.width == 1280) {
document.write('<link rel="stylesheet" type="text/css" href="1280.css">');
//alert("Resolcuion en 1280 x 960 Deberia ser llamado");
}
if (screen.width == 1600) {
document.write('<link rel="stylesheet" type="text/css" href="1600.css">');
//alert("Resoilucion en 1600 x 1200 Deberia ser llamado.");
}
// End -->
</script>
<!-- Tamaño de Script : 1.74 KB -->
Esto es todo... espero haberte ayudado amigo y no te olvides de puntuarme bien ehh ;)
