如何定义Select下拉框的边框颜色和滚动条样式

luckfly

解决思路：
Select下拉框的边框颜色和滚动条的样式都是无法直接定义的，但可以用层模拟出来。
具体步骤：
方法一：只定义下拉框边框样式。

  
/]http://www.flash8.net">[/url]
闪客之吧  
/]http://www.blueidea.com">[/url]
蓝色理想  
5d/]http://www.5d.cn">5D[/url]
多媒体  
csdn]http://www.csdn.net">CSDN[/url]

MSDN]http://msdn.microsoft.com/">MSDN[/url]

  

方法二：定义边框和滚动条样式(通过用层来模拟实现)。

function showHide(obj){     //隐现层的函数
sh={block:"none",none:"block"}
//层的display属性值在"block"和"none"间不断轮换，
//达到轮换隐藏和显示的效果
oOption.runtimeStyle.display=sh[oOption.currentStyle.display]  }
  


obj=event.srcElement
if(obj.tagName=="TD"){//判断onmouseover事件是否发生在单元格上
//设置事件发生所在的单元格的背景颜色
   obj.style.backgroundColor="#dedede"
//设置事件发生所在的单元格的字体颜色
   obj.style.color="#FFFFFF"
}



obj=event.srcElement
if(obj.tagName=="TD"){        //判断onmouseout事件是否发生在单元格上
//设置事件发生所在的单元格的背景颜色
   obj.style.backgroundColor="#FFFFFF"
   obj.style.color="#000000"//设置事件发生所在的单元格的字体颜色
}



obj=event.srcElement
if(obj.tagName=="TD"){  //判断onmouseover事件是否发生在单元格上
    showHide()        //隐藏层
//设置id为oSelect的对象内的文本为被点击的单元格内的文本
    oSelect.innerText=obj.innerText
//设置id为C_Select的对象内的值为被点击的
//单元格的自定义属性value的值
    C_Select.value=obj.value                       
    //window.open(obj.value)                  //测试跳转菜单功能
  }
  

body,td{font-size:12px}
.over{color:#dedede}
.out{color:#333333}
#oOption{
scrollbar-face-color:#FFFFFF;
scrollbar-shadow-color:#C1C1BB;
scrollbar-highlight-color:#C1C1BB;
scrollbar-3dlight-color:#EBEBE4;
scrollbar-darkshadow-color:#EBEBE4;
scrollbar-track-color:#F4F4F0;
scrollbar-arrow-color:#CACAB7;
position:absolute;display:none;width:75px;height:80px;
overflow:scroll;overflow-x:hidden;
border:#333333 1px solid;border-top:none;cursor:default
}

  
  
  
  


下拉选项6  
  
  
  
  
  


/]http://www.flash8.net">[/url]
闪吧  
/]http://www.blueidea.com">[/url]
经典
5d]http://www.5d.cn">5D[/url]

/]http://www.sina.com">[/url]
新浪
/]http://www.sohu.cn">[/url]
搜狐
/]http://www.163.com">[/url]
网易
/]http://www.etang.com">[/url]
亿唐

  
  

注意：定义滚动条样式的效果需要IE5.5+的支持。

本文来自ChinaUnix博客，如果查看原文请点：http://blog.chinaunix.net/u/15511/showart_97440.html