hola muchachines, ¿como va la vida?
quiero aprender algo que creo debe ser sencillo. quiero crear una nueva web donde el contenido quede siempre centrado independiente de la resolucion de pantalla que tenga quien la visite.
mi idea es colocar toda la información dentro de capas anidadas dentro de una gran capa contenedora, que se centrará cada vez que alguien acceda dependiendo de la resolución de su pantalla.
he buscado en muchas partes y gran claridad aun no tengo. la mejor formula que encontre es mediante un script puesto en head y unas instruciones puestas en body, se las mando para ver que opinan:
DENTRO DE HEAD VA ESTO
<script>
function centrarCapa(obj) {
an=parseInt(document.getElementById(obj).style.width);
al=parseInt(document.getElementById(obj).style.height);
x=(document.body.clientWidth-an)/2;
y=(document.body.clientHeight-al)/2;
document.getElementById(obj).style.left=x;
document.getElementById(obj).style.top=y;
}
</script>
Y DENTRO DEL BODY ESTO:
<body onLoad="centrarCapa('Layer1')" onResize="centrarCapa('Layer1')">
<div id="Layer1" style="border:1px solid red; position:absolute; width:200px; height:115px; z-index:1"></div>
</body>
la capa layer 1 sería la capa contenedora, donde se anidarían las otras. lo probe y funciona, cambiando de resolucion la capa se centra sin problema, PERO, cuando intento agregarle contenidos (en otras capas anidadas dentro de la contenedora), o no se ve o se desordena.
¿alguna idea de cual sera el problema?
¿existe alguna otra forma de que una capa contenedora aparesca siempre centrada independiente de la resolución?
la idea es que una pagina de 750px de ancho por 2 mil pixeles de alto se vea centrada horizontalmente en resoluciones superiores, y justa en la de 800 px de ancho.
se que se puede hacer algo mediante la hoja de estilo, pero no he logrado entenderlo bien.
agradeciendo una pronta respuesta se despide atentamente
ronpedro
quiero aprender algo que creo debe ser sencillo. quiero crear una nueva web donde el contenido quede siempre centrado independiente de la resolucion de pantalla que tenga quien la visite.
mi idea es colocar toda la información dentro de capas anidadas dentro de una gran capa contenedora, que se centrará cada vez que alguien acceda dependiendo de la resolución de su pantalla.
he buscado en muchas partes y gran claridad aun no tengo. la mejor formula que encontre es mediante un script puesto en head y unas instruciones puestas en body, se las mando para ver que opinan:
DENTRO DE HEAD VA ESTO
<script>
function centrarCapa(obj) {
an=parseInt(document.getElementById(obj).style.width);
al=parseInt(document.getElementById(obj).style.height);
x=(document.body.clientWidth-an)/2;
y=(document.body.clientHeight-al)/2;
document.getElementById(obj).style.left=x;
document.getElementById(obj).style.top=y;
}
</script>
Y DENTRO DEL BODY ESTO:
<body onLoad="centrarCapa('Layer1')" onResize="centrarCapa('Layer1')">
<div id="Layer1" style="border:1px solid red; position:absolute; width:200px; height:115px; z-index:1"></div>
</body>
la capa layer 1 sería la capa contenedora, donde se anidarían las otras. lo probe y funciona, cambiando de resolucion la capa se centra sin problema, PERO, cuando intento agregarle contenidos (en otras capas anidadas dentro de la contenedora), o no se ve o se desordena.
¿alguna idea de cual sera el problema?
¿existe alguna otra forma de que una capa contenedora aparesca siempre centrada independiente de la resolución?
la idea es que una pagina de 750px de ancho por 2 mil pixeles de alto se vea centrada horizontalmente en resoluciones superiores, y justa en la de 800 px de ancho.
se que se puede hacer algo mediante la hoja de estilo, pero no he logrado entenderlo bien.
agradeciendo una pronta respuesta se despide atentamente
ronpedro