js+css+div修饰select

引用Jquery文件。
<script>
var bottombgcolor = ’#999966’; //鼠标移动到下拉菜单后的背景颜色
function showbgcolor(obj) {
    obj.style.backgroundColor = bottombgcolor;
}
function hiddenbgcolor(obj) {
    obj.style.backgroundColor = ’’;
}
function showselectbottom() {
    $(’#selectbottom’).show();
}
function selected(obj) {
    $(’#select_txt_top’).val(obj.value);
    $(’#selectbottom’).hide();
}
</script>

<style>
.select_txt_top{width:100px; height:18px; border:#999999 solid 1px; line-height:18px; float:left; color:#999999; cursor:default;}
.select_but_top{width:24px; border-left:0px; text-align:center; background-color:#CCCCCC;}
.select_txt_center{width:125px;*width:127px; height:18px; border:0px; border-left:#999999 solid 1px;border-right:#999999 solid 1px;line-height:18px;  color:#000000;cursor:default; display:block; *margin-top:-2px;}
.select_txt_bottom{border-bottom:#999999 solid 1px;}
.centerbg{background-color:#996633;}
</style>

<span style="float:left">　　　　位置：</span>
                        <div style="float:left;z-index:8;">
                            <input value="请选择城市" class="select_txt_top" type="text" readonly="readonly" id="select_txt_top" onclick="showselectbottom()" /><input name="" type="text" class="select_txt_top select_but_top" value="&darr;" readonly="readonly" id="select_but_top" onclick="showselectbottom();"/>
                            <div style="clear:both;display:none;z-index:8" id="selectbottom">
                            <input value="上海市" class="select_txt_center" type="text" readonly="readonly" onmouseover="showbgcolor(this);" onmouseout="hiddenbgcolor(this);" onclick="selected(this);"/>
                            <input value="北京市" class="select_txt_center" type="text" readonly="readonly" onmouseover="showbgcolor(this);" onmouseout="hiddenbgcolor(this);" onclick="selected(this);"/>
                            <input value="广东省" class="select_txt_center" type="text" readonly="readonly" onmouseover="showbgcolor(this);" onmouseout="hiddenbgcolor(this);" onclick="selected(this);"/>
                            <input value="海南省" class="select_txt_center" type="text" readonly="readonly" onmouseover="showbgcolor(this);" onmouseout="hiddenbgcolor(this);" onclick="selected(this);"/>
                            <input value="江苏省" class="select_txt_center" type="text" readonly="readonly" onmouseover="showbgcolor(this);" onmouseout="hiddenbgcolor(this);" onclick="selected(this);"/>
                            <input value="浙江省" class="select_txt_center select_txt_bottom" type="text" readonly="readonly" onmouseover="showbgcolor(this);" onmouseout="hiddenbgcolor(this);" onclick="selected(this);"/>
                            </div>
                        </div>

-----------------------------------------------方法二
<style>
.select{width: 100px;height: 24px;background: none;border: none;margin:-2px;}
#sleHid{display: block;width: 76px;overflow: hidden;}
#sleBG{width: 98px;height: 24px;border: #61AC36 1px solid;background: url("/Images/Button/selArr.jpg") #fff no-repeat 82px 1px;display: block;}
</style>

<span style="float:left">　　　　位置：</span>
                        <span id="sleBG" style="float:left"><span id="sleHid">
                            <select id="areacode" class="select">
                                <option selected="selected">所有分类</option>
                                <option value="1">图书</option>
                                <option value="2">音像</option>
                            </select>
                        </span></span>