fix imageviewer again

apps/files_imageviewer/css/lightbox.css

@@ -1,5 +1,6 @@
 #lightbox_overlay{
 	position:fixed;
+	display:none;
 	height:100%;
 	width:100%;
 	top:0px;
@@ -12,6 +13,7 @@
 
 #lightbox{
 	position:fixed;
+	display:none;
 	max-height:90%;
 	max-width:90%;
 	top:10px;

apps/files_imageviewer/js/lightbox.js

@@ -1,12 +1,13 @@
 var lightBoxShown=false;
 $(document).ready(function() {
 	images={};//image cache
-	FileActions.register('image','View',function(filename){
-		var location='ajax/download.php?files='+filename+'&dir='+$('#dir').val();
 	var overlay=$('<div id="lightbox_overlay"/>');
 	$( 'body' ).append(overlay);
 	var container=$('<div id="lightbox"/>');
 	$( 'body' ).append(container);
+	FileActions.register('image','View',function(filename){
+		var location='ajax/download.php?files='+filename+'&dir='+$('#dir').val();
+		overlay.show();
 		if(!images[location]){
 			var img = new Image();
 			img.onload = function(){
@@ -39,12 +40,16 @@ function showLightbox(container,img){
 	container.append(img);
 	container.css('top',Math.round( ($( window ).height() - img.height)/2));
 	container.css('left',Math.round( ($( window ).width() - img.width)/2));
+	$('#lightbox').show();
+	setTimeout(function(){
 		lightBoxShown=true;
+	},100);
 }
 
 function hideLightbox(){
 	if(lightBoxShown){
-		$('#lightbox_overlay').remove();
+		$('#lightbox_overlay').hide();
-		$('#lightbox').remove();
+		$('#lightbox').hide();
+		lightBoxShown=false;
 	}
 }