下拉列表鼠標移動顯示,類似於title屬性
JSP:
<select style="width:320px" onmouseover="oooo.show(this);" onmouseout="oooo.hidd();"> <option value="" selected="selected">--請選擇--</option> <option value="A1" >A1-上一個年度未發生有責任道路交通事故,浮動顯示</option> </select>
JAVASCRIPT:
ooooo={ show:function(tag){ if(!oooo.area)oooo.createArea(); var msg=tag.options[tag.selectedIndex].text; if(msg=="--請選擇--"){ return false; } var o=tag,po,t=0,l=0,m=10,h=tag.offsetHeight,w=tag.offsetWidth; do{ t+=o.offsetTop||0; l+=o.offsetLeft||0; po=o.offsetParent; if(po==document.body)break; o=po; }while(true); oooo.area.style.top=t+h+m; oooo.area.style.left=l; oooo.area.innerHTML=msg; oooo.area.style.display='block'; }, hidd:function(){ oooo.area.style.display='none'; }, createArea:function(){ var w=300; var _area; _area=document.createElement('DIV'); _area.style.width=w+'px'; _area.style.position='absolute'; _area.zIndex='10'; _area.style.display='none'; _area.style.border='0px solid #009900'; document.body.appendChild(_area); oooo.area=_area; } }