Lightbox em jquery

Boa tarde galera!

Estou com um pequeno problema kkkk, estou desenvolvendo um lightbox proprio pra um site que estou fazendo, mas estou tendo problemas com o Chrome e Safari, postarei o código abaixo (Acho que nao está muito organizado, mas dará pra entender)

Jquery

// Funcoes para Lightbox - Pagina de Fotos

function lightBox(){

	createLightBox()

	setTimeout(function(){

 closeLightBox();

 openLightBox();

	},0);

}

function createLightBox(){

	$("body").append('<div id="main_lightbox"></div>');

	setTimeout(function(){
 $("#main_lightbox").append('<div id="bg_lightbox"></div>');
 $("#main_lightbox").append('<div id="content_lightbox"></div>');
	},0);

	setTimeout(function(){
 $("#main_lightbox #content_lightbox").append('<a href="#" id="close_lightbox">Fechar</a>');
 $("#main_lightbox #content_lightbox").append('<div id="img_lightbox"></div>');
	},0);

	setTimeout(function(){
 $("#main_lightbox #content_lightbox #img_lightbox").append("<img src='' alt=''/>");
	},0);

}

function openLightBox(){
	$(".lightbox a").click(function(){

 $("#content_lightbox #img_lightbox img").attr("src",$(this).attr("href"));

 setTimeout(function(){

 positionLightBox();

 },0);

 $("#main_lightbox").stop().fadeIn(300);

 return false;

	});
}

function positionLightBox(){

//funcao para centralizar foto na pagina

	var widthLB = $("#content_lightbox img").width();
	var heightLB = $("#content_lightbox img").height();
	var widthWin = $(window).width();
	var heightWin = $(window).height();

	var posLeft = (widthWin-widthLB)/2;
	var posTop = (heightWin-heightLB)/2;

	$("#content_lightbox").css({
 "left" : posLeft,
 "top" : posTop
	});
}

function closeLightBox(){

	$("#bg_lightbox, #close_lightbox").click(function(){
 $("#main_lightbox").fadeOut(200);

 return false;

	});
}

// Evento Ready

	$(document).ready(function(){

 // Pagina de Fotos
 lightBox();

	});

// Evento Resize

	$(window).resize(function(){

 positionLightBox();

	});  

CSS

/ ---- LIGHT BOX ---- /

#main_lightbox{
	position: fixed;
	top: 0px;
	left: 0px;
	width: 100%;
	height: 100%;
	margin: 0px;
	padding: 0px;
	display: none;
	z-index: 1500;
}

#bg_lightbox{
	position: fixed;
	top: 0px;
	left: 0px;
	width: 100%;
	height: 100%;
	margin: 0px;
	padding: 0px;
	background: #000;
	opacity: 0.6;
	z-index: 1501;
}

#content_lightbox{
	position: fixed;
	top: 0px;
	left: 0px;
	margin: 0px;
	padding: 0px;
	overflow: auto;
	z-index: 1502;
}

#close_lightbox{
	position: absolute;
	top: 0px;
	right: 0px;
	width: 130px;
	height: 46px;
	padding-top:10px;
	background: url(../imgs/bg_conteudo.png);
	font-family: 'Source Sans Pro';
	font-size: 24px;
	font-weight: 300;
	font-style: italic;
	color: #492121;
	text-align: center;
	z-index: 1502;
}
 Basicamente é o seguinte:

 

Tenho uma div que contem varios links (<a></a>), a propriedade HREF deles leva o caminho da foto grande, quando clico em um deles eu altero a propriedade SRC da imagem que está na divi do lightbox, porem, em alguns momentos o programa nao consegue pegar o tamanho da imagem e retorna zero (Funcao positionLightBox())

Ja fucei, alterei, testei e nada... se puderem ajudar ficaria muito grato!