js下用层来实现select的title提示属性_表单特效

复制代码 代码如下:

<script> <BR> function opts(selectObj){ <BR> var optDivs=document.createElement("div"); <BR> var objTable=document.createElement("table"); <BR> var objTbody=document.createElement("tbody"); <BR> optDivs.style.zIndex = "100"; <BR> objTable.style.zIndex = "100"; <BR> objTable.width=selectObj.style.width; <BR> objTable.border = "0"; <BR> objTable.cellPadding = "0"; <BR> objTable.cellSpacing = "0"; <BR> objTable.style.paddingLeft = "2"; <BR> objTable.style.fontFamily = "Verdana, Arial, Helvetica, sans-serif"; <br><br> var e = selectObj; <BR> var absTop = e.offsetTop; <BR> var absLeft = e.offsetLeft; <BR> var absWidth = e.offsetWidth; <BR> var absHeight = e.offsetHeight; <br><br> while(e = e.offsetParent){ <BR> absTop += (e.offsetTop+0.3); <BR> absLeft += e.offsetLeft; <BR> } <br><br> with (objTable.style){ <BR> position = "absolute"; <BR> top = (absTop + absHeight) + "px"; <BR> left = (absLeft+1) + "px"; <BR> border = "1px solid black"; <BR> tableLayout="fixed"; <BR> wordBreak="break-all"; <BR> } <br><br> var options = selectObj.options; <BR> var val=selectObj.value; <br><br> if (options.length > 0){ <BR> for (var i = 0; i < options.length; i++){ <BR> var newOptDiv = document.createElement("td"); <BR> var objRow=document.createElement("tr"); <BR> newOptDiv.name=options[i].value; <BR> newOptDiv.innerText=options[i].innerText; <BR> newOptDiv.title=options[i].title; <BR> newOptDiv.onmouseout = function() {this.className='smouseOut';val=selectObj.value}; <BR> newOptDiv.onmouseover = function() {this.className='smouseOver';val=this.name;}; <BR> newOptDiv.className="smouseOut"; <BR> newOptDiv.style.width=40; <BR> newOptDiv.style.cursor="default"; <BR> newOptDiv.style.fontSize = "11px"; <BR> newOptDiv.style.fontFamily = "Verdana, Arial, Helvetica, sans-serif"; <br><br> objRow.appendChild(newOptDiv); <BR> objTbody.appendChild(objRow); <BR> } <BR> } <br><br> <BR> objTbody.appendChild(objRow); <BR> objTable.appendChild(objTbody); <BR> optDivs.appendChild(objTable); <BR> document.body.appendChild(optDivs); <br><br> var IfrRef = document.createElement("div"); <BR> IfrRef.style.position="absolute"; <BR> IfrRef.style.width = objTable.offsetWidth; <BR> IfrRef.style.height = objTable.offsetHeight; <BR> IfrRef.style.top = objTable.style.top; <BR> IfrRef.style.left = objTable.style.left; <BR> IfrRef.style.backgroundColor = document.bgColor; <BR> document.body.appendChild(IfrRef); <br><br> objTable.focus(); <BR> objTable.onblur=function() {choose(selectObj,val,optDivs,IfrRef)}; <BR> } <br><br> function choose(objselect,val,delobj,delobj2){ <BR> objselect.value=val; <BR> document.body.removeChild(delobj); <BR> document.body.removeChild(delobj2); <BR> } <br><br> </script>

        
        

        
        
                111
                222