下拉列表鼠標移動顯示,類似於title屬性

下拉列表鼠標移動顯示,類似於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; 
        } 
    }


發表評論
所有評論
還沒有人評論,想成為第一個評論的人麼? 請在上方評論欄輸入並且點擊發布.
相關文章