하위메뉴나오는것 > JavaScript

본문 바로가기

사이트 내 전체검색

뒤로가기 JavaScript

하위메뉴나오는것

페이지 정보

작성자 최고관리자 작성일 21-02-10 17:28 조회 7,138 댓글 0

본문

<HTML>
 <HEAD>
 <TITLE>가자 자바스크립트 세상으로/마소 메뉴</TITLE>
 <META content="text/html; charset=windows-1251" http-equiv=Content-Type>

 <STYLE type=text/css>#menu {
        BACKGROUND: lightblue; COLOR: black; CURSOR: default; FONT-FAMILY: verdana; FONT-SIZE: 10pt; FONT-WEIGHT: bold
 }
 #menu .popup {
        BACKGROUND: lightblue; BORDER-BOTTOM: lightblue 12px solid; BORDER-LEFT: lightblue 12px solid; BORDER-RIGHT: lightblue 12px solid; BORDER-TOP: lightblue 12px solid; DISPLAY: none; FONT-FAMILY: verdana; FONT-SIZE: 8px; POSITION: absolute; WIDTH: 160pt
 }
 #menu P {
        MARGIN-BOTTOM: 0pt; MARGIN-TOP: 0pt
 }
 A:hover {
        COLOR: red; TEXT-DECORATION: none
 }
 A {
        COLOR: black; FONT-SIZE:8pt; MARGIN: 5px; TEXT-DECORATION: none
 }
 UL {
        COLOR: black; FONT-SIZE: 10pt; MARGIN: 5px; TEXT-DECORATION: none
 }
 LI {
        COLOR: black; FONT-SIZE: 10pt; MARGIN: 5px; TEXT-DECORATION: none
 }
 P {
        COLOR: black; FONT-SIZE: 10pt; MARGIN: 5px; TEXT-DECORATION: none
 }
 .over {
        COLOR: red
 }
 P {
        TEXT-ALIGN: justify; TEXT-INDENT: 0.1in
 }
 </STYLE>

 <SCRIPT language=JavaScript>
          var curPop = null;
          function clearCurrent() {
            // Hide the pop-up menu that is currently displayed.
            if (null != curPop)
                curPop.style.display = "";
            curPop = null;
          }

          function popup() {
                          clearCurrent();         
            var el = event.srcElement;
            // Display a new menu option.
            if (("P" == el.tagName) &&
                  ("menu" == el.parentElement.parentElement.parentElement.parentElement.id)) {
                // Position and display the pop-up menu.
                var elpop = document.all[el.sourceIndex + 1];
                elpop.style.pixelLeft = el.parentElement.offsetLeft+7;
                elpop.style.pixelTop  = el.offsetTop +
                  document.all.menu.offsetTop+22;
                elpop.style.display = "block";
                curPop = elpop;
            }
            event.cancelBubble = true;
          }

          function highlight() {
               
            // Highlight and popup  the menu options.
            if (null != event.fromElement)
                if ((event.fromElement.tagName == "P") &&
                                  (event.fromElement.parentElement.parentElement.parentElement.parentElement.id == "menu"))
                                  {
                  event.fromElement.className = "";
                      }
           
            if (null != event.toElement)
                if ((event.toElement.tagName == "P") && (event.toElement.parentElement.parentElement.parentElement.parentElement.id == "menu"))
                                {
                                  popup();                                       
                  event.toElement.className = "over";
                                }
          }               
               
      </SCRIPT>

 </HEAD>
 <BODY onclick=clearCurrent() bgcolor="#000080">
 <DIV style="BACKGROUND: lightblue; WIDHT: 100%">
 <TABLE border=0 id=menu onclick=popup() onmouseout=highlight();
 onmouseover=highlight();>
  <TBODY>
  <TR>
    <TD>
      <a href="http://java.up2.co.kr">Home</a></TD>
    <TD bgColor=black></TD>
    <TD>
      <P>Some Folder </P>
      <DIV class=popup>
      <P><a class="anchor" href="http://java.up2.co.kr">자바스크립트세상으로</a>
      <P> <P><a href="http://yahoo.co.kr">yahoo</a>
      </P></DIV></TD>
    <TD bgColor=black></TD>
    <TD>
      <P>What I Can</P>
      <DIV class=popup>
      <P><A href="http://www.javascripts.">JScript & HTML for IE</A>
      <P><A href="http://www.learnasp.com">ASP programming</A>
          <P><A href="http://www.javasoft.com">Java applets</A>
          <P><A href="http://www.inprise.com">Delphi programming</A>
         
          </P></DIV></TD>
    <TD bgColor=black></TD>
    <TD>
      <P>Contact with me</p>
      <DIV class=popup>
          <P><A href="mailto:aaa@aaa.com">just mail me</A>
          </p></div>
    </TD></TR></TBODY></TABLE></DIV>
 <P></P>

댓글목록 0

등록된 댓글이 없습니다.

Copyright © beautipia.co.kr. All rights reserved.

contact : webmaster@beautipia.co.kr

PC 버전으로 보기