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>

관련자료

댓글 0
등록된 댓글이 없습니다.
Today's proverb
마음을 평화롭게 가지라. 그러면 그대의 표정도 평화로워질 것이다.