<html>

<head>

<title>JavaScript 27</title>

<META http-equiv="content-type" content="text/html; charset=EUC-KR">

</head>

<script language="JavaScript">

<!--

 var width = "180";

 var border = "3";

 var offsetx = 5;

 var offsety = 5;

 var fcolor = "#e6e6e6";

 var backcolor = "#0099ff";

 var textcolor = "#0099ff";

 var capcolor = "#e6e6e6";

 var closecolor = "#c0c0c0";

//--> 
                  
</script>

<style type="text/css"> 

 #PTT { font-family: Arial; font-size: 9pt}

 #PST { font-family: 돋움; font-size: 10pt}

 A { color:0099ff; font-size: 12pt; text-decoration:none;}

 A:Hover { color:009999; font-size: 12pt; text-decoration:none;}

</style>

<body bgcolor=#222222>

<div id="overDiv" style="position: absolute; z-index:  80; width:10; visibility: hidden">

</div>

<script language="JavaScript">

 ns4 = (document.layers)? true:false

 ie4 = (document.all)? true:false

 var x = 0;

 var y = 0;

 var snow = 0;

 var sw = 0;

 var cnt = 0;

 var dir = 1;


 if ( (ns4) || (ie4) ) {

 if (ns4) over = document.overDiv

 if (ie4) over = overDiv.style

 document.onmousemove = mouseMove

 if (ns4) document.captureEvents(Event.MOUSEMOVE)

}


 function drs(text) {

 dts(1,text);

}

 function drc(text, title) {

 dtc(1,text,title);

}

 function src(text,title) {

 stc(1,text,title);

}

 function dls(text) {

 dts(0,text);

}

 function dlc(text,title) {

 dtc(0,text,title);

}

 function slc(text,title) {

 stc(0,text,title);

}

 function dcs(text) {

 dts(2,text);

}

 function dcc(text, title) {
 
 dtc(2,text,title);

}

 function scc(text,title) {

 stc(2,text,title);

}

 function nd() {

 if ( cnt >= 1 ) { sw = 0 };

 if ( (ns4) || (ie4) ) {

  if ( sw == 0 ) {

   snow = 0;

   hideObject(over);

        }
               else {

   cnt++;

  }

 }

}


 function dts(d,text) {

 txt = "<TABLE WIDTH="+width+" STYLE=\"border:1 black solid\" CELLPADDING="+border+" CELLSPACING=0 BGCOLOR=\""+backcolor+"\"><TR><TD><TABLE WIDTH=100% BORDER=0 CELLPADDING=0 CELLSPACING=0 BGCOLOR=\""+fcolor+"\"><TR><TD align=center><FONT FACE=\"돋움\" COLOR=\""+textcolor+"\" SIZE=\"2\">"+text+"</FONT></TD></TR></TABLE></TD></TR></TABLE>"

 layerWrite(txt);

 dir = d;

 disp();

}


 function dtc(d,text, title) {

 txt = "<TABLE WIDTH="+width+" STYLE=\"border:1 black solid\" CELLPADDING="+border+" CELLSPACING=0><TR><TD BGCOLOR=\""+backcolor+"\"><TABLE WIDTH=100% BORDER=0 CELLPADDING=0 CELLSPACING=0><TR><TD align=left><SPAN ID=\"PTT\">&nbsp;<FONT COLOR=\""+capcolor+"\"><B>"+title+"</B></FONT></SPAN></TD></TR></TABLE><TABLE WIDTH=100% BORDER=0 CELLPADDING=2 CELLSPACING=0 BGCOLOR=\""+fcolor+"\"><TR><TD align=center><SPAN ID=\"PST\"><FONT COLOR=\""+textcolor+"\">"+text+"</FONT><SPAN></TD></TR></TABLE></TD></TR></TABLE>"

 layerWrite(txt);

 dir = d;

 disp();

}


 function stc(d,text, title) {

 sw = 1;

 cnt = 0;

 txt = "<TABLE WIDTH="+width+" BORDER=0 CELLPADDING="+border+" CELLSPACING=0 BGCOLOR=\""+backcolor+"\"><TR><TD><TABLE WIDTH=100% BORDER=0 CELLPADDING=0 CELLSPACING=0><TR><TD><SPAN ID=\"PTT\"><B><FONT COLOR=\""+capcolor+"\">"+title+"</FONT></B></SPAN></TD><TD ALIGN=RIGHT><A HREF=\"/\" onMouseOver=\"cClick();\" ID=\"PCL\"><FONT COLOR=\""+closecolor+"\">Close</FONT></A></TD></TR></TABLE><TABLE WIDTH=100% BORDER=0 CELLPADDING=2 CELLSPACING=0 BGCOLOR=\""+fcolor+"\"><TR><TD><SPAN ID=\"PST\"><FONT COLOR=\""+textcolor+"\">"+text+"</FONT><SPAN></TD></TR></TABLE></TD></TR></TABLE>"

 layerWrite(txt);

 dir = d;

 disp();

 snow = 0;

}


 function disp() {

 if ( (ns4) || (ie4) ) {

  if (snow == 0)  {

   if (dir == 2) { // Center

    moveTo(over,x+offsetx-(width/2),y+offsety);

   }

   if (dir == 1) { // Right

    moveTo(over,5,y+offsety);

   }

   if (dir == 0) { // Left

    moveTo(over,x-offsetx-width,y+offsety);

   }

   showObject(over);

   snow = 1;

  }

 }

}


 function mouseMove(e) {

 if (ns4) {x=e.pageX; y=e.pageY}

 if (ie4) {x=event.x; y=event.y}

 if (snow) {

  if (dir == 2) { // Center

   moveTo(over,x+offsetx-(width/2)-50,y+offsety);

  }

  if (dir == 1) { // Right

   moveTo(over,5,y+offsety+5);

  }

  if (dir == 0) { // Left

   moveTo(over,x-offsetx-width,y+offsety);

  }

 }

}


 function cClick() {

 hideObject(over);

 sw=0;

}


 function layerWrite(txt) {

        if (ns4) {

                var lyr = document.overDiv.document

                lyr.write(txt)

                lyr.close()

        }

        else if (ie4) document.all["overDiv"].innerHTML = txt

  
}


 function showObject(obj) {

        if (ns4) obj.visibility = "show"

        else if (ie4) obj.visibility = "visible"

}


 function hideObject(obj) {

        if (ns4) obj.visibility = "hide"

        else if (ie4) obj.visibility = "hidden"

}


 function moveTo(obj,xL,yL) {

        obj.left = xL

        obj.top = yL

}


</script>

<div align="center">

<center>

<table border="0" cellpadding="15" cellspacing="5" align="left">

  <tr>
    <td align="left"></td>
  </tr>

  <tr>
    <td align="left">
      <a href="#" target="_blank" onMouseOver="drc('메뉴1에 대한 설명',' Menu_1 '); return true;" onMouseOut="nd(); return true;">
       <b>Menu_1</b>
      </a>
    </td>
  </tr>

  <tr>
    <td align="left">
     <a href="#" target="_blank" onMouseOver="drc('메뉴2에 대한 설명',' Menu_2 '); return true;" onMouseOut="nd(); return true;">
      <b>Menu_2</b>
     </a>
    </td>
  </tr>

  <tr>
    <td align="left">
     <a href="#" target="_blank" onMouseOver="drc('메뉴3에 대한 설명 ',' Menu_3 '); return true;" onMouseOut="nd(); return true;">
      <b>Menu_3</b>
     </a>
    </td>
  </tr>
  <tr>
    <td align="left">
     <a href="#" target="_blank" onMouseOver="drc('메뉴4에 대한 설명',' Menu_4 '); return true;" onMouseOut="nd(); return true;">
      <b>Menu_4</b>
     </a>
    </td>
  </tr>

  <tr>
    <td align="left">
     <a href="#" target="_blank" onMouseOver="drc('메뉴5에 대한 설명',' Menu_5 '); return true;" onMouseOut="nd(); return true;">
      <b>Menu_5</b>
     </a>
    </td>
  </tr>

  <tr>
    <td align="left">
     <a href=" " target="_blank" onMouseOver="drc('메뉴6에 대한 설명',' Menu_6 '); return true;" onMouseOut="nd(); return true;">
      <b>Menu_6</b>
     </a>
    </td>
  </tr>

</table>

</center>

</div>

</body>

</html>