웹마스터 팁
page_full_width" class="col-xs-12" |cond="$__Context->page_full_width">
위의 메뉴에 마우스를 올리면 밑에 메뉴가 나오는 소스
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>
<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>
제목 | 글쓴이 | 날짜 |
---|---|---|
나만의 미니홈 만들기 ㅡ 메인 기초 설계 .home.php
[12]
![]() | 예뜨락 | 2004.11.17 |
나만의 미니홈 만들기 ㅡ 메인 기초 설계2 .레이아웃 | 예뜨락 | 2004.11.18 |
나만의 미니홈 만들기 ㅡ 메인 기초 설계3 .레이아웃
[2]
![]() | 예뜨락 | 2004.11.19 |
나만의 미니홈 만들기 ㅡ 기초적인 관리 페이지
[3]
![]() | 예뜨락 | 2004.11.20 |
나만의 미니홈 만들기 ㅡ 미니홈 생성 페이지
[3]
![]() | 예뜨락 | 2004.11.20 |
나만의 미니홈 만들기 ㅡ 게시판의 디자인
![]() | 예뜨락 | 2004.11.22 |
나만의 미니홈 만들기 ㅡ 게시판 list.php 파일의 모양새 [6] | 예뜨락 | 2004.11.23 |
나만의 미니홈 만들기 ㅡ list.php , 디비 테이블 생성
[6]
![]() | 예뜨락 | 2004.11.26 |
나만의 미니홈 만들기 ㅡ view.php 파일과 제목링크
[9]
![]() | 예뜨락 | 2004.11.27 |
나만의 미니홈 만들기 ㅡ write.php 파일과 write_ok [5] | 예뜨락 | 2004.11.30 |
실명 진위여부 확인 [10] | piasol | 2004.12.01 |
개판 오분전 라인 그래프 [4] | 미친개 | 2004.12.01 |
'참조'에 관한 간단한 예제 | 플로렐라 | 2004.12.09 |
4. 쿼리문 [6] | 티다 | 2004.12.11 |
나만의 미니홈 만들기 ㅡ메뉴에 게시판 연결
[5]
![]() | 예뜨락 | 2004.12.17 |
IE 에서도 투명 알파값이 적용된 PNG 이미지를 맘껏 활용하자!
[8]
![]() | THE PAPER™ | 2004.12.27 |
"를 그냥 사용하기 [3] | 추천대화상대 | 2005.01.02 |
나만의 미니홈 만들기 ㅡ delete.php 파일 [2] | 예뜨락 | 2005.01.03 |
퍼미션을 보기좋게 구하자! [4] | 플로렐라 | 2005.01.03 |
PHP 왕초보 입문기(총괄)
[4]
![]() | 하나둘 | 2005.01.15 |
테스트 페이지 :
http://zkvpz.web-bi.net/제목없음10.html