텍스트 상자에 초점이 맞춰지면 텍스트 상자 아래에 플로팅 레이어가 나타납니다. 사용자가 웹페이지에서 텍스트 상자와 플로팅 레이어를 제외한 빈 공간을 클릭하면 플로팅 레이어를 숨깁니다. 사용자가 플로팅 레이어를 클릭하면 텍스트 상자의 값이 변경됩니다. 코드 복사 코드는 다음과 같습니다. ="Content-Type" content="text/html; charset=utf-8"> <br>function $(id) { <br>return (document.getElementById(id)) ; <br>} <br><br>function show_div(evt) { <br>var od = $('div1') <br>var e = window .event || .srcElement || e.target; <br>with (od.style) { <br>display = 'block' <br>left = o.offsetLeft 'px' <br>top = o.offsetTop o.offsetHeight 1 'px'; <br>} <br>} <br><br>function hide_div(evt) { <br>$('div1').style.display = <br>} <br> <br>function control_bubble(oEvent) { <br>//버블링 취소<br>oEvent = oEvent || window.event; <br>if (document.all ) { <br>oEvent.cancelBubble = true; } else { <br>oEvent.stopPropagation(); <br>} <br>} <br><br>function fill_input(oEvent) { <br> $('text1').value = $('div1' ).innerHTML; <br>control_bubble(oEvent); <br><br>window.onload = function() { <br>$(" text1").onfocus <br><br> document.onclick = function() { <br>//숨겨진 레이어<br>hide_div(); <br>}; <br><br>$(" text1").onclick = <br>$(" div1").onclick = fill_input; <br>} <br> style="배경 :#666;위치:absolute;overflow:auto;display: none;padding:50px;">나를 클릭하세요
