Evil ie dropdowns

gistfile1.js

function selectDropDownIEbehavior() {

// Apply this behavior for IE only
if (!$.browser.msie)
return; 

var expand = function()
{
var width = $(this).css("width");
// Don't overwrite the stored original width,
// if the event occurs for a second time before contract()
if (width == "auto")
return; 

$(this)
.data("origWidth", width)
.css("width", "auto")
};

var contract = function()
{
var width = $(this).css("width");
// Don't perform this twice
if (width != "auto")
return; 

var origWidth = $(this).data("origWidth");
// If the original width was not stored, abort
if (origWidth === undefined)
return; 

$(this)
.css("width", origWidth)
.data("origWidth", width);
};

$("select").each(function(index) {

// The select needs to be enclosed in a container with the same CSS width,
// which uses overflow:hidden, in order to hide the expanded part
var width = $(this).css("width");
var span = '';
$(this).wrap(span);

// Add event listeners
$(this)
.mousedown(expand)
.blur(contract)
.change(contract);

});

}



//All I do is import the .js file containing the above function and call the following script in my document, which applies the fix to all select boxes when the //document is ready:


jQuery(document).ready(selectDropDownIEbehavior);