openImage=function(imageUrl){
	var self=this;
	//aņado la capa negra
	this.negro=document.createElement('DIV');
	this.negro.className='phloadScreen';
	this.negro.style.position='absolute';
	this.negro.style.top='0';
	this.negro.style.left='0';
	var tamPagina=dimensionesPagina();
	this.negro.style.width=tamPagina[0]+'px';
	this.negro.style.height=tamPagina[1]+'px';
	this.negro.style.zIndex='1001';
	document.body.appendChild(this.negro);
	//capa contenedora
	this.contenedor=document.createElement('DIV');
	this.contenedor.className='phloadContainer';
	this.contenedor.style.position='absolute';
	//marco superior
	this.marcoSup=document.createElement('DIV');
	this.marcoSup.className='phloadTop';
	this.marcoSup.style.fontSize='0px';
	this.marcoSup.style.position='relative';
	this.contenedor.appendChild(this.marcoSup);
	//marcoIzquierdo
	this.marcoIzq=document.createElement('DIV');
	this.marcoIzq.className='phloadLeft';
	this.marcoIzq.style.position='absolute';
	this.marcoIzq.style.left='0';
	this.marcoIzq.style.fontSize='0px';
	this.contenedor.appendChild(this.marcoIzq);
	//Imagen
	this.imagen=new Image();
	this.imagen.className='phloadImage';
	this.imagen.style.position='absolute';
	this.imagen.setAttribute('title', 'Haz clic sobre la foto para cerrarla');
	this.imagen.onclick=function(){
		document.body.removeChild(self.mascara);
		document.body.removeChild(self.negro);
	}
	this.contenedor.appendChild(this.imagen);
	//marco derecho
	this.marcoDer=document.createElement('DIV');
	this.marcoDer.className='phloadRight';
	this.marcoDer.style.position='absolute';
	this.marcoDer.style.right='0';
	this.marcoDer.style.fontSize='0px';
	this.contenedor.appendChild(this.marcoDer);
	//marco inferior
	this.marcoInf=document.createElement('DIV');
	this.marcoInf.className='phloadBottom';
	this.marcoInf.style.fontSize='0px';
	this.marcoInf.style.position='absolute';
	this.marcoInf.style.bottom='0';
	this.marcoInf.style.width='100%';
	this.contenedor.appendChild(this.marcoInf);
	//esquina TL
	this.TL=document.createElement('DIV')
	this.TL.className='phloadTL';
	this.TL.style.position='absolute';
	this.TL.style.top='0';
	this.TL.style.left='0';
	this.TL.style.fontSize='0px';
	this.contenedor.appendChild(this.TL);
	//esquina TR
	this.TR=document.createElement('DIV')
	this.TR.className='phloadTR';
	this.TR.style.position='absolute';
	this.TR.style.top='0';
	this.TR.style.right='0';
	this.TR.style.fontSize='0px';
	this.contenedor.appendChild(this.TR);
	//esquina BL
	this.BL=document.createElement('DIV')
	this.BL.className='phloadBL';
	this.BL.style.position='absolute';
	this.BL.style.bottom='0';
	this.BL.style.left='0';
	this.BL.style.fontSize='0px';
	this.contenedor.appendChild(this.BL);
	//esquina BR
	this.BR=document.createElement('DIV')
	this.BR.className='phloadBR';
	this.BR.style.position='absolute';
	this.BR.style.bottom='0';
	this.BR.style.right='0';
	this.BR.style.fontSize='0px';
	this.contenedor.appendChild(this.BR);
	//boton cerrar
	this.cerrar=document.createElement('DIV');
	this.cerrar.setAttribute('title', 'Cerrar');
	this.cerrar.className='phloadClose';
	this.cerrar.style.position='absolute';
	this.cerrar.style.fontSize='0px';
	this.cerrar.onclick=function(){
		document.body.removeChild(self.mascara);
		document.body.removeChild(self.negro);
	}
	this.cerrar.onmouseover=function(){
		self.cerrar.className='phloadCloseHover';
	}
	this.cerrar.onmouseout=function(){
		self.cerrar.className='phloadClose';
	}
	this.cerrar.style.cursor='pointer';
	this.contenedor.appendChild(this.cerrar);
	
	//mascar donde se mete todo el contenido, en un principio de tamaņo 0x0
	this.mascara=document.createElement('DIV')
	this.mascara.style.overflow='hidden';
	this.mascara.style.width='0';
	this.mascara.style.height='0';
	this.mascara.style.zIndex='1001';
	this.mascara.style.position='absolute';
	this.mascara.style.top=parseInt(tamPagina[1]/2)+'px';
	this.mascara.style.left=parseInt(tamPagina[0]/2)+'px';
	this.mascara.appendChild(this.contenedor);
	document.body.appendChild(this.mascara);
	
	//tamaņos y posicion de la mascara
	this.posYM=parseInt(tamPagina[1]/2)
	this.posXM=parseInt(tamPagina[0]/2)
	this.tamYM=0;
	this.tamXM=0;
	
	this.visualizar=function(){
		tamX=self.imagen.offsetWidth+self.marcoIzq.offsetWidth+self.marcoDer.offsetWidth;
		tamY=self.imagen.offsetHeight+self.marcoSup.offsetHeight+self.marcoInf.offsetHeight;
		aux=false;
		if (self.tamXM<tamX*0.5){
			self.tamXM=self.tamXM+14;
			aux=true
		}else{
			if (self.tamXM<tamX*0.8){
				self.tamXM=self.tamXM+12;
				aux=true
			}else{
				if (self.tamXM<tamX){
					self.tamXM=self.tamXM+10;
					aux=true
				}
			}
		}
		if (self.tamYM<tamY*0.5){
			self.tamYM=self.tamYM+14;
			aux=true
		}else{
			if (self.tamYM<tamY*0.8){
				self.tamYM=self.tamYM+12;
				aux=true
			}else{
				if (self.tamYM<tamY){
					self.tamYM=self.tamYM+10;
					aux=true
				}
			}
		}
		if (self.tamXM>tamX)
			self.tamYX=tamX;
		self.mascara.style.width=self.tamXM+'px';
		if (self.tamYM>tamY)
			self.tamYM=tamY;
		self.mascara.style.height=self.tamYM+'px';
		self.posXM=parseInt(tamPagina[0]/2)-(self.tamXM/2);
		self.posYM=parseInt(tamPagina[1]/2)-(self.tamYM/2);
		self.mascara.style.top=self.posYM+'px';
		self.mascara.style.left=self.posXM+'px';
		if (aux==true){
			self.marcoIzq.style.height=self.imagen.offsetHeight+'px';
			self.marcoDer.style.height=self.imagen.offsetHeight+'px';
			self.imagen.style.left=self.marcoIzq.offsetWidth+'px';
			self.contenedor.style.width=tamX+'px';
			self.contenedor.style.height=tamY+'px';
			self.contenedor.style.top=parseInt(self.tamYM/2-tamY/2)+'px';
			self.contenedor.style.left=parseInt(self.tamXM/2-tamX/2)+'px';
			setTimeout(self.visualizar, 1);
		}
	}
	
	//visualizamos la foto
	//this.visualizar();
	//al cargar la imagen, debe mostrarse
	this.imagen.onload=function(){
		//pongo los tamaņos de los divs
		self.marcoIzq.style.height=self.imagen.offsetHeight+'px';
		self.marcoDer.style.height=self.imagen.offsetHeight+'px';
		self.imagen.style.left=self.marcoIzq.offsetWidth+'px';
		self.contenedor.style.width=String(self.imagen.offsetWidth+self.marcoIzq.offsetWidth+self.marcoDer.offsetWidth)+'px';
		self.contenedor.style.height=String(self.imagen.offsetHeight+self.marcoSup.offsetHeight+self.marcoInf.offsetHeight)+'px';
		self.visualizar();
	}
	this.imagen.src=imageUrl;
}

dimensionesPagina=function(){
	//funcion que pone el alto y ancho a la capa gris
	var altoPag;
	var anchoPag;
	if( typeof( window.innerWidth ) == 'number' ) {
	  //Non-IE
	  anchoPag = window.innerWidth;
	  altoPag = window.innerHeight;
	} else if( document.documentElement && ( document.documentElement.clientWidth || document.documentElement.clientHeight ) ) {
	  //IE 6+ in 'standards compliant mode'
	  anchoPag = document.documentElement.clientWidth;
	  altoPag = document.documentElement.clientHeight;
	} else if( document.body && ( document.body.clientWidth || document.body.clientHeight ) ) {
	  //IE 4 compatible
	  anchoPag = document.body.clientWidth;
	  altoPag = document.body.clientHeight;
	}
	return [anchoPag, altoPag];
}