(function($){
     $.fn.extend({
          dropIn: function (options) {
               var options =  $.extend({ // Default values
                    inside:window, // element, center into window
                    transition: 0, // millisecond, transition time
                    minX:0, // pixel, minimum left element value
                    minY:0, // pixel, minimum top element value
                    withScrolling:true, // booleen, take care of the scrollbar (scrollTop)
                    vertical:true, // booleen, center vertical
                    horizontal:true, // booleen, center horizontal
                    showScreen:true, // whether to show a screen behind the dropIn
                    easingMethod:'easeOutElastic', // the easing method
                    easingStart:100, // proximity to the end destination (in pixels) that the easing kicks in
                    overlayName:'overlay-screen' // id (without #)of the element to be used as an overlay screen
               }, options);
               return this.each(function() {
                    var props = {}; //= {position:'absolute'};
                    if (options.vertical) {
                         var top = ($(options.inside).height() - $(this).outerHeight()) / 2;
                         if (options.withScrolling) top += $(options.inside).scrollTop() || 0;
                         top = (top > options.minY ? top : options.minY);
                         $.extend(props, {top: (top-options.easingStart)+'px'});
                    }
                    if (options.horizontal) {
                          var left = ($(options.inside).width() - $(this).outerWidth()) / 2;
                          if (options.withScrolling) left += $(options.inside).scrollLeft() || 0;
                          left = (left > options.minX ? left : options.minX);
                          $.extend(props, {left: left+'px'});
                    }
                    
                   	var showOverlay = function(name) {
                   		var id = '#'+name;
	                 	if (!$(id).length) {
				    		$('body').append('<div id="'+name+'"></div>');
				    		$(id).css({
				    			 position:'absolute'
				    			,top:$(window).scrollTop()
				    			,left:0
				    			,width:'100%'
				    			,height:'100%'
				    			,opacity:'.5'
				    			,background:'black'
				    			,'z-index':9998
				    			,display:'none'
				    		});	
				    		$(id).fadeIn();
				    	}; 	
                   	};                
                   	
                   	/* get rid of the scrollbars */
                   	$('body').css('overflow','hidden');                
                   	
                   	/* stop any other animations */
                   	$(this).animate().stop();
                   	
                   	/* adjust the vertical position of the dropIn */
			    	if ($(this).css('top')<$(window).scrollTop()) {
			    		$(this).css('top',($(window).scrollTop()-1000) + 'px');
			    	};      
			    	
			    	/* horizontally center the dropIn */
                   	$(this).css({left:props.left});
                   	
                   	/* do our animations */
                    $(this).animate(props, options.transition,options.showScreen ? function() { showOverlay(options.overlayName) } : null).animate({ top: '+='+options.easingStart+'px' }, {duration: 'slow', easing: options.easingMethod});
                   
                    return $(this);
               });
          }
     });
})(jQuery);