Html & Script

레이어 띄우기

페이지 정보

본문

<html>
<head>
<title></title>
</head>
<body>
<script language="javascript">
 function BlooMsg(obj){ 
  var obj
  var div = eval("document.all.div_" + obj);
 
  if (div.style.display == ''){
   div.style.display = "none";
  
  } else {
   div.style.top = event.y - 10 - document.body.scrollTop;
   div.style.left = event.x + 10;
   div.style.display = "";
  
  }
 }
</script>


<div id="div_1" style="position:absolute; z-index:1; display:none;">
<table border="0"  cellpadding="3" cellspacing="1" bgcolor="#0066FF" width="100">

 <tr>
  <td bgcolor="#FFFFCC">친구추가</td> 
 </tr>
 <tr>
  <td bgcolor="#FFFFCC"><a href="/disk/main.jsp">디스크로 이동</a></td>
 
 </tr>
</table>
</div>
<a href="#" onclick="javascript:BlooMsg('1');">클릭이벤트</a>
</body>
</html>

[출처] [script]div태그를 이용한 클릭시 레이어 띄우기 |작성자 여유



--------------------------------------------------------------------------------
[참고] 다른 방법 메뉴작성


<script type="text/javascript">
function mymenu(idx) {
  var obj=eval("document.all.table"+idx).style;
  obj.display=obj.display==""?"none":"";
}
</script>
<a href="javascript;" onmouseover="mymenu(1)" onmouseout="mymenu(1)">메뉴1</a>
<a href="javascript;" onmouseover="mymenu(2)" onmouseout="mymenu(2)">메뉴2</a>
<a href="javascript;" onmouseover="mymenu(3)" onmouseout="mymenu(3)">메뉴3</a>
<a href="javascript;" onmouseover="mymenu(4)" onmouseout="mymenu(4)">메뉴4</a>
<a href="javascript;" onmouseover="mymenu(5)" onmouseout="mymenu(5)">메뉴5</a>
<table id=table1 style="display:none;"><tr><td>1</td></tr></table>
<table id=table2 style="display:none;"><tr><td>2</td></tr></table>
<table id=table3 style="display:none;"><tr><td>3</td></tr></table>
<table id=table4 style="display:none;"><tr><td>4</td></tr></table>
<table id=table5 style="display:none;"><tr><td>5</td></tr></table>

관련자료

등록된 댓글이 없습니다.
Today's proverb
진실한 의식을 갖춘 영혼은 자신보다 훨씬 뛰어난 무엇을 발견할 줄 압니다. 칭찬이란 이해입니다. 근본적으로 누구나 위대하고 훌륭합니다. 누군가를 아무리 칭찬한다 해도 지나치지 않습니다. 타인 속에 있는 위대함과 아름다움을 발견하는 눈을 기르십시오. 《보여줄 수 있는 사랑은 아주 작습니다》 (칼릴지브란)