<div class="codetitle"> <span><a style="CURSOR: pointer" data="13132" class="copybut" id="copybut13132" onclick="doCopy('code13132')"><u>코드 복사</u></a></span> 코드는 다음과 같습니다.</div> <div class="codebody" id="code13132"> <br><!DOCTYPE html PUBLIC "-//W3C/ /DTD XHTML 1.0 전환//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd"> <br><html xmlns="http://www.w3 .org/ 1999/xhtml"> <br><head> <br><meta http-equiv="Content-Type" content="text/html; charset=utf-8" /> <br> <title>jquery 팝업 레이어 예</title> <br><script type="text/javascript" src="http://www.jqueryajax.com/wp-content/uploads/2009/03/jquery- 132min1.js"></script> <br><script type="text/javascript"> <br>$(function(){ <br>$(".but").click(function( ){ <br>var str = "정보 내용입니다. 정보 내용입니다!" <br>$(".form").html(str) <br>$("#faqbg"). css({display:"block",height:$(document).height()}); <br>var yscroll =document.documentElement.scrollTop; <br>$("#faqdiv").css("top" ,"100px" ); <br>$("#faqdiv").css("display","block") <br>document.documentElement.scrollTop=0 <br>$( ".close" ).click(function(){ <br>$("#faqbg").css("display","none"); <br>$("#faqdiv").css("display" ,"없음" ); <br>}) <br></script><br><style type="text/css">#faqbg{배경색:#666666; 위치:절대값:99; 상단:0; 너비:1000px; 불투명도:0.5; 필터: 알파(불투명도=50);-moz-불투명도: 0.5;} <BR>#faqdiv{position:absolute;width:400px; left:50%; margin-left:- 200px; 높이: 자동; z-색상:#fff; 테두리:1px #8FA4F5 단색;} <BR>#faqdiv h2{ 높이:25px; 색상:#8FA4F5 ; 위치: 왼쪽: 10px; 줄 높이: 25px;} <BR>#faqdiv h2 a{위치:절대값: 5px; 색상:#FF0000 🎜>#faqdiv .form{padding:10px;} <BR></style> <BR><BR><body > <BR><BR><div id= "faqbg"> ;</div> <BR><div id="faqdiv" style="display:none"> <br><h2>정보 창<a href="#" class="close "> 닫기</a></h2> <br><div class="form"> <br>다음은 프롬프트 메시지입니다! ! <br><BR></div> <BR></div> <BR><p align="center"> <BR><input value="popup" class="but" type= "버튼" /> <br><input type="button" value="Close" class="close" /> <br></p> ;/html> <BR><BR></style> </div>