Criei esse plugin que eh rapidnho e dah uma enganada legal na aplicacao. Quem quiser eh soh mandar bala. Naum coloquei todos os eventos, mas podem ser passados por parametros e isso fica a criterio de quem quiser implementar. ;-)
$.fn.comboBox = function(options) {
function combo(cbo) {
var $dv = jQuery('
if (selected.length == 0) {
selected = cbo.find("option:first");
}
$sp.html(selected.html());
cbo.css('opacity', 0).wrap($dv).before($sp); /*este eh o segredo*/
/* handlers */
/**********************/
cbo.bind(
{ "change.uniform": function() {
$sp.text(cbo.find(":selected").html());
},
"focus.uniform": function() { },
"blur.uniform": function() { },
"mousedown.uniform touchbegin.uniform": function() { },
"mouseup.uniform touchend.uniform": function() { },
"click.uniform touchend.uniform": function() { },
"mouseenter.uniform": function() { },
"mouseleave.uniform": function() { },
"keyup.uniform": function() {
$sp.text(cbo.find(":selected").html());
}
});
};
return this.each(function() {
combo(jQuery(this));
});
}
div.cboBox { border: 1px solid gray; background: black; color: gray; background: url('seta.gif') no-repeat right; }
div.cboBox span { position:absolute; margin: 2px 0px 0px 3px }
div.cboBox span, select {font-family: Arial; font-size: 11px}