텍스트 박스에 이미지 넣기

<font style=font-size:9pt;>

요즘 유행하는 것이죠. 텍스트 박스에 이미지가 들어가 있구 마우스 클릭하면 사라지는 기능.<br>
두가지 방법을 알려드릴거구요. 첫번째는 포커스가 박스안에 있으면 새로고침 하더라도 다시 이미지가<br>
나타나지 안습니다. 포커스가 박스안에 없을 경우만 나타납니다. 두번째는 포커스가 인풋박스 안에 있더라도<br>
이미지가 나타납니다.<br><br>

첫번째 방법.<br>
<input type='text' size='38' style='height:20px;' style='background-image:url(./outlogin_skin/camelot_gray2/images/aa.gif);background-repeat:no-repeat;background-position:center; border-width:1px; border-top-color:black; border-right-color:black; border-bottom-color:black; border-left-color:black; border-style:solid;' onFocus="this.style.background='#ffffff'">
<br><br>
두번째 방법
<script language=JavaScript>
<!--
var c=false;
function ch () {
if ( c ) return;
document.search.q.style.backgroundImage="";
c=true;
}
//-->
</script>

<form name=search>
<input size=38 name=q style='background-image:url(./outlogin_skin/camelot_gray2/images/aa.gif);background-repeat:no-repeat;background-position:center; border-width:1px; border-top-color:black; border-right-color:black; border-bottom-color:black; border-left-color:black; border-style:solid;' onkeydown='return ch();' onmousedown='return ch();'>
</form>

</font>