웹마스터 팁

  2. Support
  3. 웹마스터 팁

위의 메뉴에 마우스를 올리면 밑에 메뉴가 나오는 소스

2006.10.10 22:15

김민환

마우스를 올리면 메뉴가 밑에 나옵니다^.^

<html>

<STYLE type=text/css>#menu {
BACKGROUND:#ffffff; COLOR: black; CURSOR: default; FONT-FAMILY: verdana; FONT-SIZE: 10pt; FONT-WEIGHT: bold
}
#menu .popup {
BACKGROUND:#f8efef; BORDER-BOTTOM:#ffffff 12px solid; BORDER-LEFT: #ffffff 12px solid; BORDER-RIGHT: #ffffff 12px solid; BORDER-TOP: #ffffff 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: #708090; 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: #708090
}
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()>
<DIV style="BACKGROUND: #ffffff; WIDHT: 100%">
<TABLE border=0 id=menu onclick=popup() onmouseout=highlight();
onmouseover=highlight();>
<TBODY>
<TR>
<TD>
<P>누구누구 Home</P>
<DIV class=popup>
<P><A href="#" onClick="/*window.open*/('http:/...','_blank','toolbar=no,directories=no,resizable=yes,scrollbars=yes,width=800,height=600,left=100,top=40')" onfocus="this.blur()">Main</A>
                </div>


<TD bgColor=#ffffff></TD>
<TD>
<P>Profile</P>
<DIV class=popup>
<P><A href="#" onClick="/*window.open*/('http://...','_blank','toolbar=no,directories=no,resizable=yes,scrollbars=no,width=900,height=600,left=70,top=40')" onfocus="this.blur()">me?</A>


</P></DIV></TD>
<TD bgColor=#ffffff></TD>
<TD>
<P>Gallery</P>
<DIV class=popup>
<P><A href="#" onClick="/*window.open*/('http://...','_blank','toolbar=no,directories=no,resizable=yes,scrollbars=yes,width=850,height=600,left=100,top=40')" onfocus="this.blur()">My Gal</A>
<P><A href="#" onClick="/*window.open*/('http://...','_blank','toolbar=no,directories=no,resizable=yes,scrollbars=yes,width=800,height=600,left=100,top=40')" onfocus="this.blur()">적당한 메뉴를 넣으셈.^^</A>
</P></DIV></TD>
<TD bgColor=#ffffff></TD>
<TD>
<P>Download</p>
<DIV class=popup>
<P><A href="#" onClick="/*window.open*/('http://..','_blank','toolbar=no,directories=no,resizable=yes,scrollbars=yes,width=800,height=600,left=100,top=100')" onfocus="this.blur()">이곳에 메뉴를..</A>
</P></DIV></TD>
<TD bgColor=#ffffff></TD>
<TD>
<P>Music (download)</P>
<DIV class=popup>
<P><A href="#" onClick="/*window.open*/('http://...','_blank','toolbar=no,directories=no,resizable=yes,scrollbars=yes,width=800,height=600,left=100,top=40')" onfocus="this.blur()">Pops.</A>
<P><A href="#" onClick="/*window.open*/('http://...','_blank','toolbar=no,directories=no,resizable=yes,scrollbars=yes,width=800,height=600,left=100,top=40')" onfocus="this.blur()">gayo</A>
<P><A href="#" onClick="/*window.open*/('http://..','_blank','toolbar=no,directories=no,resizable=yes,scrollbars=yes,width=800,height=600,left=100,top=40')" onfocus="this.blur()">Movie Theme.</A>
                </div>

<TD bgColor=#ffffff></TD>
<TD>
<P>Site</p>
<DIV class=popup>
<P><A href="#" onClick="/*window.open*/('http://...','_blank','toolbar=no,directories=no,resizable=yes,scrollbars=yes,width=800,height=600,left=100,top=40')" onfocus="this.blur()">Cool Site</A>
</P></DIV></TD>
<TD bgColor=#ffffff></TD>
<TD>
<P>Free Board</p>
<DIV class=popup>
<P><A href="#" onClick="/*window.open*/('http://board1.hanmir.com/blue/Board.cgi?path=db249&db=1004patti&act=reflash','_blank','toolbar=no,directories=no,resizable=yes,scrollbars=yes,width=800,height=600,left=100,top=100')" onfocus="this.blur()">Free Board (old)</A>
<P><A href="#" onClick="/*window.open*/('http://www.ifuni.com/board/funiboard.php?db=patti','_blank','toolbar=no,directories=no,resizable=yes,scrollbars=yes,width=800,height=480,left=100,top=100')" onfocus="this.blur()">Free Board (new)</A>
<P><A href="#" onClick="/*window.open*/('http://board2.hanmir.com/blue/Board.cgi?path=db4&db=rubyjh','_blank','toolbar=no,directories=no,resizable=yes,scrollbars=yes,width=800,height=600,left=150,top=40')" onfocus="this.blur()">Guest Book</A>
</P></DIV></TD>
<TD bgColor=#ffffff></TD>
<TD>
<P>E-Mail</p>
<DIV class=popup>
<script>
function Fmail(pPage,Opt) { popUpWin = /*window.open*/(pPage,'',Opt); }
</script>
<P><a href="javascript:Fmail('http://blueboard.co.kr/mail/mail.cgi?cmd=input&skin=child
&to_name=수신자이름&to_mail=수신자메일주소&subject=안녕하세요^^*', 'top=200,left=330,width=250,height=378')" onfocus="this.blur()">Mail</A>
</P></DIV></TD></TR></TBODY></HTML>
    </table>
이 게시물을
수정 삭제
좋아요
목록
제목 글쓴이 날짜
편리한 컴내꺼 포트개방 (com.ne.kr FTP Port Open) [1] phase 2003.08.16
Marquee 태그를 이용한 간단한 스크립트 [7] 뒹굴리스트 2003.08.06
나름대로 만들어본 가운데 팝업 스크립트 [3] phase 2003.07.31
HTML경고창 [수정#2] [14] [락위듀]아렌티 2003.07.26
초강력 울트라..매가톤 간단...랜덤이미지.. [6] 김한샘 2003.07.24
노프레임 홈페이지 수정 편리하게 &용량줄이기. [9] 세죠위그이 2003.07.15
한줄씩 올라가는 뉴스티거용 인데요....제로보드하구는 어케...쩝 [12] 하나비 2003.07.08
이미지 필터를 사용한 간단한 소스 [3] NzeoZen 2003.07.06
상태바에 2개의 메세지가 뜨는 태그 김주형 2003.07.03
마우스 오른쪽 버튼 누르면 원하는 메뉴 뜨게 만들기(다른사이트) [3] 김주형 2003.07.03
제로보드 사용시 아이프레임의 크기를 내용에 따라 바꿔주는 스크립트 [7] 쿨리안 2003.06.28
아이프레임으로 나타낸 문서를 크기에 맞게 자동으로 사이즈 조절 [3] DODGE 2003.06.28
웹에서그림그리기 [5] 카이저 2003.06.27
손쉬운 롤오버 이미지 자동생성 [15] 행복한고니 2003.06.16
[스크립트] 메뉴에 마우슬 데면 서브 메뉴가 나온다 [2] 처절초보 2003.06.16
[스크립트]오른쪽 버튼 누르면 메뉴나오기^^ [1] 처절초보 2003.06.16
Top, Back 함께사용하기 file sharim 2003.06.11
자바스크립트로 두개 이상의 페이지 동시에 열기. [4] 이성헌 2003.06.08
엔터키 걸러내고 코멘트 무조건 10자이상으로 하게하는 자바스크립트 소스 [9] 교행사랑 2003.06.06
오른쪽마우스 클릭금지,드래그금지,하단주소 숨기기 한꺼번에~ [8] 한길 2003.06.03
태그 쓰기