(function($) {
	$.extend($.fn, {
		fixIeSelectOverflow : function(oOptions) 
		{
			// get elements
			var oElements = jQuery(this);
			
			// function to hide virtual dropdown
			var hideVirtualDropdown = function()
			{
				// hide virtual dropdown
				oElements.parents()
					.find('div.dropdown').css({'display':'none'});
			};
			
			// if browser is not ie 7 or 8
			if(!jQuery.browser.msie || (parseInt(jQuery.browser.version) != 7 
				&& parseInt(jQuery.browser.version) != 8))
			{
				// just return as this plugin is only valid for ie 7 and 8!
				return;
			}
			
			// iterate over all selected elements
			oElements.each(function()
			{
				// save select el in oSelect
				var oSelect = jQuery(this);

				// if select has no height/width
				if(!oSelect.height() || !oSelect.width())
				{
					// just return
					return;
				}

				// if select allready has a wrapped div
				if(oSelect.parent('div.wrapper').length > 0)
				{
					// nothing to do. just return
					return;
				}
				
				
				// wrap select el with div
			    oSelect.wrap('<div class="wrapper" style="position:relative;top:0px;left:0px;">');

			    // create overlay div. we will use this to overlay
			    // the selectbox which will prevent the real dropdown to appear!
			    var sOverlayDiv = '<div class="overlay" style="position:absolute;top:0;left:0;'
				    +'background-color:white;width:'
			    	+oSelect.width()+'px;height:'
			    	+oSelect.height()+'px"></div>';

				// create virtual dropdown div el. we will use this element to emulate the dropdown
				var sDropdownDiv = '<div class="dropdown" style="position:absolute;top:'
					+oSelect.height()+';left:0;display:none;background-color:'
					+oSelect.css('background-color')+';z-index:1000;">overlay</div>';

				// append both elements to the wrapper div of the current selectbox
				oSelect.parent('div.wrapper').append(sOverlayDiv);
				oSelect.parent('div.wrapper').append(sDropdownDiv);

			    // get overlay el
			    var oOverlay = oSelect.parent('div.wrapper').find('div.overlay');
			    // get virtual dropdown el
			    var oDropdown = oSelect.parent('div.wrapper').find('div.dropdown');

			    // fade overlay element to a opacity of 0.01 percent. this will
			    // make the overlay solid, so the underlying selectbox onlick event
			    // wont get triggered on a click!
			    oOverlay.fadeTo(0, 0.01);

			    // instead we add an click event to the overlay!				    
			    oOverlay.click(function()
				{
					// get options count of selectbox
				    var iOptionsCount = oSelect.find('option').length 
				    	+ oSelect.find('optgroup').length;

					// clone selectbox, remove some attributes and add the
					// size attribute with the number of options found in the
					// real select element
			    	var oDropdownSelect = oSelect.clone().removeAttr('id')
			    		.removeAttr('name').attr('size',iOptionsCount)
			    		.attr('style','width:auto !important;')
			    		.addClass('dropdown-select');

		    		// make wirtual dropdown el visible and add cloned select el
				    oDropdown.css({'display':'block'}).html('').append(oDropdownSelect);

				    // get selected value of the real select el
				    var sSelectedValue = oSelect.find('option:selected').val();

				    // if we found a selected value
				    if(sSelectedValue)
				    {
					    // select option in virtual dropdown select by found value
				    	oDropdownSelect.find('option[value='+sSelectedValue+']')
				    		.attr("selected", "selected");
					}

				    // bind click event to virtual dropdown select element
				    oDropdownSelect.click(function()
					{
				    	// get selected value
				    	var sSelectedValue = jQuery(this).find('option:selected').val();

				    	// if selected value found
				    	if(sSelectedValue)
				    	{
				    		// select option in real select el by found value
						    oSelect.find('option[value='+sSelectedValue+']')
						    	.attr("selected", "selected");

					    	// trigger change action on real select el
					    	oSelect.change();
					    }
					});

					// unbind mouseup function to hide virtual dropdown
				    jQuery(document).unbind('mouseup',hideVirtualDropdown);
				    
				    // bind mouseup function to hide virtual dropdown
				    jQuery(document).bind('mouseup',hideVirtualDropdown);
				});
			});
		}
	});
})(jQuery);
