效果圖：
/*控制元件*/
/*js檔案*/
window。onload=function（）{ userpswdvalue=null； initCalc（）；}var userpswdvalue；var CapsLockValue=0；var checkSoftKey；var pIsPWD=false；var hidekeyboard=true；var ps；function setVariables（）{ tablewidth=630； tableheight=20； if （navigator。appName == “Netscape”） { horz=“。left”； vert=“。top”； docStyle=“document。”； styleDoc=“”； innerW=“window。innerWidth”； innerH=“window。innerHeight”； offsetX=“window。pageXOffset”； offsetY=“window。pageYOffset”； } else { horz=“。pixelLeft”； vert=“。pixelTop”； docStyle=“”； styleDoc=“。style”； innerW=“document。body。clientWidth”； innerH=“document。body。clientHeight”； offsetX=“document。body。scrollLeft”； offsetY=“document。body。scrollTop”； }}function checkLocation（）{ if （checkSoftKey） { objectXY=“softkeyboard”； var availableX=eval（innerW）； var availableY=eval（innerH）； var currentX=eval（offsetX）； var currentY=eval（offsetY）； x=availableX-tablewidth+currentX； y=currentY； evalMove（）； } setTimeout（“checkLocation（）”，0）；}function evalMove（）{ eval（docStyle + objectXY + styleDoc + vert + “=” + y）；}self。onError=null；currentX = currentY = 0； whichIt = null； lastScrollX = 0； lastScrollY = 0；NS = （document。layers） ？ 1 ： 0；IE = （document。all） ？ 1： 0；function heartBeat（）{ if（IE） { diffY = document。body。scrollTop； diffX = document。body。scrollLeft； } if（NS） { diffY = self。pageYOffset； diffX = self。pageXOffset； } if（diffY ！= lastScrollY） { percent = 。1 * （diffY - lastScrollY）； if（percent > 0） percent = Math。ceil（percent）； else percent = Math。floor（percent）； if（IE） document。all。softkeyboard。style。pixelTop += percent； if（NS） document。softkeyboard。top += percent； lastScrollY = lastScrollY + percent；} if（diffX ！= lastScrollX） { percent = 。1 * （diffX - lastScrollX）； if（percent > 0） percent = Math。ceil（percent）； else percent = Math。floor（percent）； if（IE） document。all。softkeyboard。style。pixelLeft += percent； if（NS） document。softkeyboard。left += percent； lastScrollX = lastScrollX + percent； } }function checkFocus（x，y） { stalkerx = document。softkeyboard。pageX； stalkery = document。softkeyboard。pageY； stalkerwidth = document。softkeyboard。clip。width； stalkerheight = document。softkeyboard。clip。height； if（ （x > stalkerx && x < （stalkerx+stalkerwidth）） && （y > stalkery && y < （stalkery+stalkerheight））） return true； else return false；}function grabIt（e） {checkSoftKey = false；if（IE） {whichIt = event。srcElement；while （whichIt。id！=null&&whichIt。id。indexOf（“softkeyboard”） == -1） {whichIt = whichIt。parentElement；if （whichIt == null） { return true； } }if（whichIt。style！=null）{whichIt。style。pixelLeft = whichIt。offsetLeft；whichIt。style。pixelTop = whichIt。offsetTop；}currentX = （event。clientX + document。body。scrollLeft）；currentY = （event。clientY + document。body。scrollTop）； } else {window。captureEvents（Event。MOUSEMOVE）；if（checkFocus （e。pageX，e。pageY）） {whichIt = document。softkeyboard；StalkerTouchedX = e。pageX-document。softkeyboard。pageX；StalkerTouchedY = e。pageY-document。softkeyboard。pageY；} }return true； }function moveIt（e） {if （whichIt == null） { return false； }if（IE） {if（whichIt。style！=null）{newX = （event。clientX + document。body。scrollLeft）；newY = （event。clientY + document。body。scrollTop）；distanceX = （newX - currentX）； distanceY = （newY - currentY）；currentX = newX； currentY = newY；whichIt。style。pixelLeft += distanceX；whichIt。style。pixelTop += distanceY；if（whichIt。style。pixelTop < document。body。scrollTop） whichIt。style。pixelTop = document。body。scrollTop；if（whichIt。style。pixelLeft < document。body。scrollLeft） whichIt。style。pixelLeft = document。body。scrollLeft；if（whichIt。style。pixelLeft > document。body。offsetWidth - document。body。scrollLeft - whichIt。style。pixelWidth - 20） whichIt。style。pixelLeft = document。body。offsetWidth - whichIt。style。pixelWidth - 20；if（whichIt。style。pixelTop > document。body。offsetHeight + document。body。scrollTop - whichIt。style。pixelHeight - 5） whichIt。style。pixelTop = document。body。offsetHeight + document。body。scrollTop - whichIt。style。pixelHeight - 5；event。returnValue = false；}} else {whichIt。moveTo（e。pageX-StalkerTouchedX，e。pageY-StalkerTouchedY）；if（whichIt。left < 0+self。pageXOffset） whichIt。left = 0+self。pageXOffset；if（whichIt。top < 0+self。pageYOffset） whichIt。top = 0+self。pageYOffset；if（ （whichIt。left + whichIt。clip。width） >= （window。innerWidth+self。pageXOffset-17）） whichIt。left = （（window。innerWidth+self。pageXOffset）-whichIt。clip。width）-17；if（ （whichIt。top + whichIt。clip。height） >= （window。innerHeight+self。pageYOffset-17）） whichIt。top = （（window。innerHeight+self。pageYOffset）-whichIt。clip。height）-17；return false；}return false； }function dropIt（） {whichIt = null；if（NS） window。releaseEvents （Event。MOUSEMOVE）；return true； }if（NS） {window。captureEvents（Event。MOUSEUP|Event。MOUSEDOWN）；window。onmousedown = grabIt；window。onmousemove = moveIt；window。onmouseup = dropIt； }if（IE） {document。onmousedown = grabIt；document。onmousemove = moveIt；document。onmouseup = dropIt； }var style1=“”；document。write（style1）； document。write（“