Mi ventana autoajustable...
si es que se le llama así... ya he comentado varias veces que yo de esto de javascript, poco.. pero hago mis pinitos... he estado enredando y he hecho esto...
<code>
<% dim carpeta, foto
carpeta = Request.QueryString("carpeta")
foto = Request.QueryString("foto")
%>
<html>
<head>
<title>Processblack.com : : e-zine de Diseño Gráfico, Blog y galerías virtuales : :</title><meta http-equiv="Content-Type" content="text/html; charset=iso-8859-1">
<link rel="stylesheet" href="../css/Estilo.css" type="text/css">
<script type="text/javascript">
function resizeWindow()
{
top.resizeTo((image.width),(image.height))
}
</script>
</head>
<body bgcolor="#FFFFFF" text="#000000" leftmargin="0" topmargin="0" marginwidth="0" marginheight="0">
<table width="100%" border="0" cellspacing="5" cellpadding="0">
<tr>
<td><img src="<%=(carpeta & "/" & foto)%>" id="image" onload="resizeWindow()"></td>
</tr>
</table>
</body>
</html>
</code>
Por QueryString paso la localización de la imagen y el nombre de esta. cuando cargo la imagen llama a resizeWindow() que ajusta la ventana al tamaño de la imagen y le sumo unos pixels para que quede un margen blanco alrededor.
El problema: no va sobre mozilla 1.4. ¿Alguien sabe porque? me he dado cuenta (yo solito :))de que si en vez de poner:
<code>top.resizeTo((image.width),(image.height))</code>
pongo
<code>top.resizeTo(500, 300)</code>
funciona bien... help plz!
kassel
Hola Black, tb se poco sobre javaScript,pero creo que si defines dos variables :
ancho=(image.width)
y alto =(image.height)
y luego:
top.resizeTo((ancho),(alto))
cuentame xq me parece haberlo visto asi, aunque ahora es sólo una teoria mia.
microbians Staff Plus
resizeTo es el tamaño de la ventana con el interface incluidos ... si tienes un skin muy grueso se te come la imagen...
- - - he aqui mi aportación a un tamaño fijo de ventana, que no es lo mismo q que sea ajustable al contenido del diseño
<code>// Width del espacio cliente
getClientWidth=function(){
var w=null;
if (typeof(window.innerWidth)=='number') {
w=window.innerWidth
} else if( document.documentElement && document.documentElement.clientWidth ) {
w=document.documentElement.clientWidth;
} else if( document.body && document.body.clientWidth ) {
w=document.body.clientWidth;
}
return w
}
// Height del espacio cliente
getClientHeight=function(){
var h=null;
if (typeof(window.innerHeight)=='number') {
h=window.innerHeight
} else if( document.documentElement && document.documentElement.clientHeight ) {
h=document.documentElement.clientHeight;
} else if( document.body && document.body.clientHeight ) {
h=document.body.clientHeight;
}
return h
}
// resize de la ventana para que el interior mida lo correcto
oldWinW=0
oldWinH=0
resizeWindowToFit=function(w,h){
if (oldWinW!=w||oldWinH!=h) {
oldWinW=w
oldWinH=h
var docW=getClientWidth()
var docH=getClientHeight()
window.resizeBy(w-docW,h-docH);
var docW=getClientWidth()
var docH=getClientHeight()
if (docW!=w||docH!=h) {
window.resizeBy(w-docW,h-docH);
}
}
}</code>
pones resizeWindowToFit(600,600) y el contenido (no el continente) coge ese tamaño
Klein
Pon esto:
var ancho = document.getElementById("image").width;
var alto = document.getElementById("image").height;
top.resizeTo(ancho,alto);
black
gracias a los tres! con lo de las variables funciona! :)
Microbians, ¿con lo del skin te refieres al propio explorador?
como abro la imagen en un asp con una tabla ke he añadido unos pixeles a la ventana y consigo encajarla... ¿puede dar algún tipo de problema esa "chapucilla"?
GRACIAS!!!!!!!
microbians Staff Plus
Klein eso no funciona asi... mira este código...
Probarlo y veréis lo que digo.
- - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - -
open.html<code><html>
<body>
<a href="img.html" onClick="window.open(this.href,'trabajos','width=400,height=400');return false">OPEN</a><br>
</body>
</html></code>
img.html<code><html>
<head>
<script>
doit=function(){
var w = window.innerWidth? window.innerWidth : document.body.clientWidth
var h = window.innerHeight? window.innerHeight : document.body.clientHeight
alert( "Tamaño del espacio cliente correcto generado por un open.window: "+ w +" , "+ h + " (bien)")
w=document.getElementById("laimagen").width;
h=document.getElementById("laimagen").height;
alert( "Tamaño de la imagen: "+ w +" , "+ h + " (bien)")
top.resizeTo(w,h);
alert( "top.resizeTo("+ w +" , "+ h + ");")
var w = window.innerWidth? window.innerWidth : document.body.clientWidth
var h = window.innerHeight? window.innerHeight : document.body.clientHeight
alert( "Tamaño del espacio cliente generado por un resizeTo: "+ w +" , "+ h + " (mal)")
}
</script>
</head>
<body style="margin:0px;" onload="doit()">
<img id="laimagen" src="none.gif" border="0" width="400" height="400">
</body>
</html></code>
- - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - -
black
Ok! Te refieres a que el tamaño de la ventana que abre no tiene en cuenta el tamaño del explorador y la imagen no entra en la ventana?
yo eso lo he solucionado con lo que comentaba antes... pero no sé si dará algún tipo de problema entre exploradores, al ser valores fijos...
<code>
function resizeWindow(){
var ancho = (document.getElementById("image").width) + 19;
var alto = (document.getElementById("image").height) + 59;
top.resizeTo(ancho,alto);
}</code>
microbians Staff Plus
Exacto, eso da problemas... no todas las configuraciones tienen el mismo SKIN lo que hace que los bordes sean más o menos gruesos. También te afecta el tamaño del scroll si la ventana es con scroll y no todo el mundo tiene el mismo grosor.
Al poner esos valores fijos te arrisesgas a que a alguien le salga cortada y o con scroll si no has forzado para que no salga.
black
Gracias por la aclaración y gracias por el script, Master!
;)
Klein
Funcionar... sí funciona. Era simplemente para aclarar por qué no le funcionaba en Mozilla.
Es verdad lo que dices Gaby que en el script no tiene en cuenta las barras de herramientas del explorador, bordes, etc...
microbians Staff Plus
Eso me pasa por leer por encima XDD