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
해가 들면 어떻고, 바람이 불면 어떻고, 눈이 오면 어떠랴. 해가 들어주어도 고맙고, 바람이 불어주어도 고맙고, 눈이 와주어도 고마울 뿐. 그렇다, 고맙지 않은 것이 없다. 밤은 밤이어서 고맙고, 새벽은 새벽이어서 고맙고, 낮은 낮이어서 고맙다. 아, 고마운 삼라만상이여! (정채봉)