jQuery.qTip = function(caller,headline,desc,dim){

	
    if(caller != ""){
	$('#' + caller).click(function(){
		dimmer(1)
		objectBox(headline,desc)
	})
    }else{
        dimmer(1)
		objectBox(headline,desc)
    }
	
	
	function dimmer(options){
	if(dim != false){
			if(options == 1){
				$('body').append('<div id="darker"></div>');
				$('#darker').css({
						zIndex : '10',
						opacity: 0.0,
						width : jQuery(document).width(),
						height : jQuery(document).height()
				}).animate({ opacity: 0.7 })
			}
				
			if(options == 0){
				$('#darker').animate({ opacity: 0.0 }, function(){
					$(this).remove();
				})
			} 
		}
	}
	
	
	function objectBox(headline,desc){
		var divMessageBox = document.createElement('div')
		var headlineBox = document.createElement('h1')
		
		$(divMessageBox).addClass('MessageBoxer')		
		
		if(desc == ''){
			desc = 'Keine Beschreibung vorhanden';
		}
		
		$(divMessageBox).html(desc)
		$(headlineBox).html(headline)
		
		$('body').append(divMessageBox)
		
		$(divMessageBox).prepend(headlineBox)
		
		$(headlineBox).append('<img onclick=\" $(\'.MessageBoxer\').animate({opacity : 0.0}, function(){ $(this).remove(); });  dimmer(0); \" id="closeMessageBox" style="cursor:pointer" src="/gfx/uploader/del.gif" align="right">')
		
		$(headlineBox).css({
			'width'  : '100%',
			'font-size' : '16px',
			'font-weight' : 'bold',
			'padding' : '0px', 
			'margin' : '0px', 
			'margin-bottom' : '5px', 
			'padding-bottom' : '5px', 
			'border-bottom' : '1px dotted #808080' 
		})
		
		
		$(divMessageBox).css({
			zIndex : '1000',
			opacity: 0.0,
			width : '36%',
			'backgroundColor' : 'white',
			'color' : 'black',
			'position'  : 'absolute',
			'top' : '50px',
			'left' : '50%',
			'margin-left' : '-18%',
			'border-radius' : '10px',
			'-moz-border-radius' : '10px',
			'-webkit-border-radius' : '10px', 
			'padding' : '10px', 
			'font-size' : '11px',
			'line-height' : '1.5em'
		}).animate({opacity:1.0})
	}
		
};