레이어팝업 > 그누4 팁자료실

그누4 팁자료실

그누보드4와 관련된 팁을 여러분들과 함께 공유하세요.
나누면 즐거움이 커집니다.

레이어팝업 정보

레이어팝업

첨부파일

레이어팝업.html (1.3K) 371회 다운로드 2011-12-06 10:57:10

본문

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
 <head>
 <title> 레이어 팝업 </title>

 <style type="text/css">
  #layerPop{width:600px;height:200px;position:absolute;display:none;border:1px solid #ccc;padding:10px;}
  #layerPop .close{position:absolute;bottom:5px;right:5px;}
 </style>

 <script type="text/javascript">
 <!--
 //레이어 팝업 열기
 function openLayer(IdName, tpos, lpos){
  var pop = document.getElementById(IdName);
  pop.style.display = "block";
  pop.style.top = tpos + "px";
  pop.style.left = lpos + "px";
 }

 //레이어 팝업 닫기
 function closeLayer(IdName){
  var pop = document.getElementById(IdName);
  pop.style.display = "none";
 }
   //-->
 </script>
 </head>

 <body>
 
 <a href="#" onclick="openLayer('layerPop',100,200)">Open</a>

 <div id="layerPop">
 <strong>내용</strong>
 <ol>
  <li>레이어 팝업 열기: openLayer('레이어 팝업ID',top위치,left위치)</li>
  <li>레이어 팝업 닫기 closeLayer('레이어 팝업ID')</li>
  <li>첨부터 레이어 팝업을 보여줄라면 #layerPop에서 display:none; 제거</li>
 </ol>
 <a href="#" onclick="closeLayer('layerPop')" class="close">close</a>
 </div>

 </body>
</html>
추천
12
  • 복사

댓글 8개

목록
문의 PC 버전
© SIRSOFT
현재 페이지 제일 처음으로