Notetu

画面が表示されると、画像を表示、クリックで削除。

jQueryを読み込んで、下記のスクリプトを読み込む。
スクリプト内に表示画像を記載しています。

$(function(){
 var layer = $('<div id="box_layer"></div>');
 var win = $('<div id="box_window"></div>');
 //最初に表示する画像のURL
 var img = $('<img src="a-b.jpg" width="600" height="400" />')
 var boxlink = $('.box');
 layer.css('opacity','0.7');
 var closeBtn = layer.add(img);

 win.append(img);

 $('body').append(layer).append(win);

 	win.fadeIn(300);
 			var w = img.attr('width');
 			var h = img.attr('height');
 			var bodyW = $('body').width();
 			var bodyH = $('body').height();
 			var left = -(w/2);
 			var top = -(h/2);

 			//alert(mW);

 	win.css({
 				width: w+'px',
 				height :h+'px',
 				marginLeft:left+'px',
 				marginTop:top+'px',
 				padding:'10px',
 				background: 'gray'
 			});

 	layer.fadeIn(300);

 	closeBtn.click(close);

 	function close(){
 		openFlg = false;
 		layer.fadeOut(300);
 		win.fadeOut(300,function(){
 			img.remove();
 			titlebox.text("");
 		});

 		closeBtn.unbind('click',close);
 	}

});

Demo