full-down메뉴[펌]
<html>
<head>
<title>http://www.blueb.co.kr</title>
<style>
#chromemenu{
width: 99%;
}
#chromemenu:after{ /*Add margin between menu and rest of content in Firefox*/
content: ".";
display: block;
height: 0;
clear: both;
visibility: hidden;
}
#chromemenu ul{
border: 1px solid #BBB;
width: 100%;
background: url(http://www.blueb.co.kr/SRC/javascript/image4/chromebg.gif) center center repeat-x; /*Theme Change here*/
margin-left: 0;
padding-left: 0;
margin: 0;
float: left;
font: bold 11px tahoma;
}
#chromemenu ul li{
display: inline;
}
#chromemenu ul li a{
float: left;
color: #7F7F7F;
font-weight: bold;
padding: 6px 12px 6px 7px;
text-decoration: none;
background: url(http://www.blueb.co.kr/SRC/javascript/image4/divider.gif) center right no-repeat; /*Theme Change here*/
}
#chromemenu ul li a:hover{
color: #494949;
}
#chromemenu ul li a[onMouseover]:after{ /*HTML to indicate drop down link*/
content: " v";
/*content: " " url(downimage.gif); /*uncomment this line to use an image instead*/
}
/* ######### Style for Drop Down Menu ######### */
.dropmenudiv{
position:absolute;
top: 0;
border: 1px solid #BBB; /*Theme Change here*/
border-bottom-width: 0;
font:normal 11px tahoma;
line-height:18px;
z-index:100;
background-color: white;
width: 200px;
visibility: hidden;
filter: progid:DXImageTransform.Microsoft.Shadow(color=#CACACA,direction=135,strength=4); /*Add Shadow in IE. Remove if desired*/
}
.dropmenudiv a{
width: 100%;
display: block;
text-indent: 3px;
border-bottom: 1px solid #BBB; /*Theme Change here*/
padding: 2px 0;
text-decoration: none;
font-weight: bold;
color: black;
}
.dropmenudiv a:hover{ /*Theme Change here*/
background-color: #F0F0F0;
}
</style>
<script type="text/javascript">
<!--
//Chrome Drop Down Menu- Author: Dynamic Drive (http://www.dynamicdrive.com)
//Last updated: Jan 1st, 06'
var cssdropdown={
disappeardelay: 250, //set delay in miliseconds before menu disappears onmouseout
//No need to edit beyond here////////////////////////
dropmenuobj: null, ie: document.all, firefox: document.getElementById&&!document.all,
getposOffset:function(what, offsettype){
var totaloffset=(offsettype=="left")? what.offsetLeft : what.offsetTop;
var parentEl=what.offsetParent;
while (parentEl!=null){
totaloffset=(offsettype=="left")? totaloffset+parentEl.offsetLeft : totaloffset+parentEl.offsetTop;
parentEl=parentEl.offsetParent;
}
return totaloffset;
},
showhide:function(obj, e, visible, hidden){
if (this.ie || this.firefox)
this.dropmenuobj.style.left=this.dropmenuobj.style.top="-500px"
if (e.type=="click" && obj.visibility==hidden || e.type=="mouseover")
obj.visibility=visible
else if (e.type=="click")
obj.visibility=hidden
},
iecompattest:function(){
return (document.compatMode && document.compatMode!="BackCompat")? document.documentElement : document.body
},
clearbrowseredge:function(obj, whichedge){
var edgeoffset=0
if (whichedge=="rightedge"){
var windowedge=this.ie && !window.opera? this.iecompattest().scrollLeft+this.iecompattest().clientWidth-15 : window.pageXOffset+window.innerWidth-15
this.dropmenuobj.contentmeasure=this.dropmenuobj.offsetWidth
if (windowedge-this.dropmenuobj.x < this.dropmenuobj.contentmeasure) //move menu to the left?
edgeoffset=this.dropmenuobj.contentmeasure-obj.offsetWidth
}
else{
var topedge=this.ie && !window.opera? this.iecompattest().scrollTop : window.pageYOffset
var windowedge=this.ie && !window.opera? this.iecompattest().scrollTop+this.iecompattest().clientHeight-15 : window.pageYOffset+window.innerHeight-18
this.dropmenuobj.contentmeasure=this.dropmenuobj.offsetHeight
if (windowedge-this.dropmenuobj.y < this.dropmenuobj.contentmeasure){ //move up?
edgeoffset=this.dropmenuobj.contentmeasure+obj.offsetHeight
if ((this.dropmenuobj.y-topedge)<this.dropmenuobj.contentmeasure) //up no good either?
edgeoffset=this.dropmenuobj.y+obj.offsetHeight-topedge
}
}
return edgeoffset
},
dropit:function(obj, e, dropmenuID){
if (this.dropmenuobj!=null) //hide previous menu
this.dropmenuobj.style.visibility="hidden"
this.clearhidemenu()
if (this.ie||this.firefox){
obj.onmouseout=function(){cssdropdown.delayhidemenu()}
this.dropmenuobj=document.getElementById(dropmenuID)
this.dropmenuobj.onmouseover=function(){cssdropdown.clearhidemenu()}
this.dropmenuobj.onmouseout=function(){cssdropdown.dynamichide(e)}
this.dropmenuobj.onclick=function(){cssdropdown.delayhidemenu()}
this.showhide(this.dropmenuobj.style, e, "visible", "hidden")
this.dropmenuobj.x=this.getposOffset(obj, "left")
this.dropmenuobj.y=this.getposOffset(obj, "top")
this.dropmenuobj.style.left=this.dropmenuobj.x-this.clearbrowseredge(obj, "rightedge")+"px"
this.dropmenuobj.style.top=this.dropmenuobj.y-this.clearbrowseredge(obj, "bottomedge")+obj.offsetHeight+1+"px"
}
},
contains_firefox:function(a, b) {
while (b.parentNode)
if ((b = b.parentNode) == a)
return true;
return false;
},
dynamichide:function(e){
var evtobj=window.event? window.event : e
if (this.ie&&!this.dropmenuobj.contains(evtobj.toElement))
this.delayhidemenu()
else if (this.firefox&&e.currentTarget!= evtobj.relatedTarget&& !this.contains_firefox(evtobj.currentTarget, evtobj.relatedTarget))
this.delayhidemenu()
},
delayhidemenu:function(){
this.delayhide=setTimeout("cssdropdown.dropmenuobj.style.visibility='hidden'",this.disappeardelay)
},
clearhidemenu:function(){
if (this.delayhide!="undefined")
clearTimeout(this.delayhide)
}
}
//-->
</script>
</head>
<body>
<!--1차메뉴-->
<div id="chromemenu">
<ul>
<li><a href="http://www.www.blueb.co.kr/">HOME</a></li>
<li><a href="http://www.www.blueb.co.kr/" onMouseover="cssdropdown.dropit(this,event,'dropmenu1')">BLUEB</a></li>
<li><a href="http://www.www.blueb.co.kr/" onMouseover="cssdropdown.dropit(this,event,'dropmenu2')">NEWS</a></li>
<li><a href="http://www.www.blueb.co.kr/" onMouseover="cssdropdown.dropit(this,event,'dropmenu3')">검색엔진</a></li>
</ul>
</div>
<!--2차메뉴-->
<!--1st drop down menu -->
<div id="dropmenu1" class="dropmenudiv">
<a href="http://www.www.blueb.co.kr/">BlueB</a>
<a href="http://www.www.blueb.co.kr/">Submenu 1-1</a>
<a href="http://www.www.blueb.co.kr/">Submenu 1-2</a>
<a href="http://www.www.blueb.co.kr/">Submenu 1-3</a>
<a href="http://www.www.blueb.co.kr/">Submenu 1-4</a>
<a href="http://www.www.blueb.co.kr/">Submenu 1-5</a>
<a href="http://www.www.blueb.co.kr/">Submenu 1-6</a>
<a href="http://www.www.blueb.co.kr/">Submenu 1-7</a>
<a href="http://www.www.blueb.co.kr/">Submenu 1-8</a>
<a href="http://www.www.blueb.co.kr/">Submenu 1-9</a>
</div>
<!--2nd drop down menu -->
<div id="dropmenu2" class="dropmenudiv" style="width: 150px;">
<a href="http://www.www.blueb.co.kr/">KBS 2</a>
<a href="http://www.www.blueb.co.kr/">KBC 1</a>
<a href="http://www.www.blueb.co.kr/">MBC</a>
<a href="http://www.www.blueb.co.kr/">SBS</a>
</div>
<!--3rd anchor link and menu -->
<div id="dropmenu3" class="dropmenudiv" style="width: 150px;">
<a href="http://www.www.blueb.co.kr//">Google</a>
<a href="http://www.www.blueb.co.kr/">Yahoo</a>
<a href="http://www.www.blueb.co.kr/">MSN</a>
</div>
</body>
</html>
blueb 사이트에서 퍼왔습니다.<div class='small'>[이 게시물은 관리자님에 의해 2011-10-31 17:16:08 PHP & HTML에서 이동 됨]</div>
<head>
<title>http://www.blueb.co.kr</title>
<style>
#chromemenu{
width: 99%;
}
#chromemenu:after{ /*Add margin between menu and rest of content in Firefox*/
content: ".";
display: block;
height: 0;
clear: both;
visibility: hidden;
}
#chromemenu ul{
border: 1px solid #BBB;
width: 100%;
background: url(http://www.blueb.co.kr/SRC/javascript/image4/chromebg.gif) center center repeat-x; /*Theme Change here*/
margin-left: 0;
padding-left: 0;
margin: 0;
float: left;
font: bold 11px tahoma;
}
#chromemenu ul li{
display: inline;
}
#chromemenu ul li a{
float: left;
color: #7F7F7F;
font-weight: bold;
padding: 6px 12px 6px 7px;
text-decoration: none;
background: url(http://www.blueb.co.kr/SRC/javascript/image4/divider.gif) center right no-repeat; /*Theme Change here*/
}
#chromemenu ul li a:hover{
color: #494949;
}
#chromemenu ul li a[onMouseover]:after{ /*HTML to indicate drop down link*/
content: " v";
/*content: " " url(downimage.gif); /*uncomment this line to use an image instead*/
}
/* ######### Style for Drop Down Menu ######### */
.dropmenudiv{
position:absolute;
top: 0;
border: 1px solid #BBB; /*Theme Change here*/
border-bottom-width: 0;
font:normal 11px tahoma;
line-height:18px;
z-index:100;
background-color: white;
width: 200px;
visibility: hidden;
filter: progid:DXImageTransform.Microsoft.Shadow(color=#CACACA,direction=135,strength=4); /*Add Shadow in IE. Remove if desired*/
}
.dropmenudiv a{
width: 100%;
display: block;
text-indent: 3px;
border-bottom: 1px solid #BBB; /*Theme Change here*/
padding: 2px 0;
text-decoration: none;
font-weight: bold;
color: black;
}
.dropmenudiv a:hover{ /*Theme Change here*/
background-color: #F0F0F0;
}
</style>
<script type="text/javascript">
<!--
//Chrome Drop Down Menu- Author: Dynamic Drive (http://www.dynamicdrive.com)
//Last updated: Jan 1st, 06'
var cssdropdown={
disappeardelay: 250, //set delay in miliseconds before menu disappears onmouseout
//No need to edit beyond here////////////////////////
dropmenuobj: null, ie: document.all, firefox: document.getElementById&&!document.all,
getposOffset:function(what, offsettype){
var totaloffset=(offsettype=="left")? what.offsetLeft : what.offsetTop;
var parentEl=what.offsetParent;
while (parentEl!=null){
totaloffset=(offsettype=="left")? totaloffset+parentEl.offsetLeft : totaloffset+parentEl.offsetTop;
parentEl=parentEl.offsetParent;
}
return totaloffset;
},
showhide:function(obj, e, visible, hidden){
if (this.ie || this.firefox)
this.dropmenuobj.style.left=this.dropmenuobj.style.top="-500px"
if (e.type=="click" && obj.visibility==hidden || e.type=="mouseover")
obj.visibility=visible
else if (e.type=="click")
obj.visibility=hidden
},
iecompattest:function(){
return (document.compatMode && document.compatMode!="BackCompat")? document.documentElement : document.body
},
clearbrowseredge:function(obj, whichedge){
var edgeoffset=0
if (whichedge=="rightedge"){
var windowedge=this.ie && !window.opera? this.iecompattest().scrollLeft+this.iecompattest().clientWidth-15 : window.pageXOffset+window.innerWidth-15
this.dropmenuobj.contentmeasure=this.dropmenuobj.offsetWidth
if (windowedge-this.dropmenuobj.x < this.dropmenuobj.contentmeasure) //move menu to the left?
edgeoffset=this.dropmenuobj.contentmeasure-obj.offsetWidth
}
else{
var topedge=this.ie && !window.opera? this.iecompattest().scrollTop : window.pageYOffset
var windowedge=this.ie && !window.opera? this.iecompattest().scrollTop+this.iecompattest().clientHeight-15 : window.pageYOffset+window.innerHeight-18
this.dropmenuobj.contentmeasure=this.dropmenuobj.offsetHeight
if (windowedge-this.dropmenuobj.y < this.dropmenuobj.contentmeasure){ //move up?
edgeoffset=this.dropmenuobj.contentmeasure+obj.offsetHeight
if ((this.dropmenuobj.y-topedge)<this.dropmenuobj.contentmeasure) //up no good either?
edgeoffset=this.dropmenuobj.y+obj.offsetHeight-topedge
}
}
return edgeoffset
},
dropit:function(obj, e, dropmenuID){
if (this.dropmenuobj!=null) //hide previous menu
this.dropmenuobj.style.visibility="hidden"
this.clearhidemenu()
if (this.ie||this.firefox){
obj.onmouseout=function(){cssdropdown.delayhidemenu()}
this.dropmenuobj=document.getElementById(dropmenuID)
this.dropmenuobj.onmouseover=function(){cssdropdown.clearhidemenu()}
this.dropmenuobj.onmouseout=function(){cssdropdown.dynamichide(e)}
this.dropmenuobj.onclick=function(){cssdropdown.delayhidemenu()}
this.showhide(this.dropmenuobj.style, e, "visible", "hidden")
this.dropmenuobj.x=this.getposOffset(obj, "left")
this.dropmenuobj.y=this.getposOffset(obj, "top")
this.dropmenuobj.style.left=this.dropmenuobj.x-this.clearbrowseredge(obj, "rightedge")+"px"
this.dropmenuobj.style.top=this.dropmenuobj.y-this.clearbrowseredge(obj, "bottomedge")+obj.offsetHeight+1+"px"
}
},
contains_firefox:function(a, b) {
while (b.parentNode)
if ((b = b.parentNode) == a)
return true;
return false;
},
dynamichide:function(e){
var evtobj=window.event? window.event : e
if (this.ie&&!this.dropmenuobj.contains(evtobj.toElement))
this.delayhidemenu()
else if (this.firefox&&e.currentTarget!= evtobj.relatedTarget&& !this.contains_firefox(evtobj.currentTarget, evtobj.relatedTarget))
this.delayhidemenu()
},
delayhidemenu:function(){
this.delayhide=setTimeout("cssdropdown.dropmenuobj.style.visibility='hidden'",this.disappeardelay)
},
clearhidemenu:function(){
if (this.delayhide!="undefined")
clearTimeout(this.delayhide)
}
}
//-->
</script>
</head>
<body>
<!--1차메뉴-->
<div id="chromemenu">
<ul>
<li><a href="http://www.www.blueb.co.kr/">HOME</a></li>
<li><a href="http://www.www.blueb.co.kr/" onMouseover="cssdropdown.dropit(this,event,'dropmenu1')">BLUEB</a></li>
<li><a href="http://www.www.blueb.co.kr/" onMouseover="cssdropdown.dropit(this,event,'dropmenu2')">NEWS</a></li>
<li><a href="http://www.www.blueb.co.kr/" onMouseover="cssdropdown.dropit(this,event,'dropmenu3')">검색엔진</a></li>
</ul>
</div>
<!--2차메뉴-->
<!--1st drop down menu -->
<div id="dropmenu1" class="dropmenudiv">
<a href="http://www.www.blueb.co.kr/">BlueB</a>
<a href="http://www.www.blueb.co.kr/">Submenu 1-1</a>
<a href="http://www.www.blueb.co.kr/">Submenu 1-2</a>
<a href="http://www.www.blueb.co.kr/">Submenu 1-3</a>
<a href="http://www.www.blueb.co.kr/">Submenu 1-4</a>
<a href="http://www.www.blueb.co.kr/">Submenu 1-5</a>
<a href="http://www.www.blueb.co.kr/">Submenu 1-6</a>
<a href="http://www.www.blueb.co.kr/">Submenu 1-7</a>
<a href="http://www.www.blueb.co.kr/">Submenu 1-8</a>
<a href="http://www.www.blueb.co.kr/">Submenu 1-9</a>
</div>
<!--2nd drop down menu -->
<div id="dropmenu2" class="dropmenudiv" style="width: 150px;">
<a href="http://www.www.blueb.co.kr/">KBS 2</a>
<a href="http://www.www.blueb.co.kr/">KBC 1</a>
<a href="http://www.www.blueb.co.kr/">MBC</a>
<a href="http://www.www.blueb.co.kr/">SBS</a>
</div>
<!--3rd anchor link and menu -->
<div id="dropmenu3" class="dropmenudiv" style="width: 150px;">
<a href="http://www.www.blueb.co.kr//">Google</a>
<a href="http://www.www.blueb.co.kr/">Yahoo</a>
<a href="http://www.www.blueb.co.kr/">MSN</a>
</div>
</body>
</html>
blueb 사이트에서 퍼왔습니다.<div class='small'>[이 게시물은 관리자님에 의해 2011-10-31 17:16:08 PHP & HTML에서 이동 됨]</div>
댓글 2개
18년 전
좋은 소스 감사합니다^^ 유용하게 잘 사용 하겠습니다.
SNAPi
18년 전
가로메뉴
게시글 목록
| 번호 | 제목 |
|---|---|
| 11111 | |
| 11108 | |
| 11107 | |
| 11105 |
JavaScript
이미지 저작권 관련 설명 1탄
1
|
| 11101 |
Flash
초간단 플래시테두리 없애는 방법입니다.
3
|
| 11099 |
JavaScript
직접만든 자바스크립트 Trim 함수입니다.
1
|
| 11095 | |
| 11093 | |
| 24843 | |
| 11065 | |
| 11063 | |
| 11059 |
JavaScript
PHP Ajax 프레임워크
3
|
| 29001 | |
| 11054 |
JavaScript
일반PC로 서버 만들경우....
4
|
| 28999 | |
| 11050 | |
| 28998 |
HTML
mshtml.dll error 발생시
|
| 28956 | |
| 11044 | |
| 11023 |
JavaScript
[입문자용 강좌] 상수?
20
|
| 11004 | |
| 28946 |
HTML
[입문자용강좌] 변수란?
9
|
| 10993 | |
| 10990 | |
| 28903 | |
| 10984 | |
| 24842 |
계약서
고용계약서
|
| 28900 |
HTML
marquee 태그 활용법
2
|
| 10982 | |
| 10978 |
JavaScript
실제 이미지 크기 알아내기
3
|
| 28899 | |
| 10974 |
Flash
플래쉬 투명바탕 어떻게 하는거죠?
3
|
| 10970 | |
| 24831 | |
| 24830 |
계약서
표준임대차 계약서
|
| 10967 |
JavaScript
ie,firefox alpha값
2
|
| 10965 | |
| 10963 | |
| 10956 |
JavaScript
왕초보 소스 중 질문있어요...^^;
6
|
| 10954 |
Flash
플래시 그림판 소스 입니다.
1
|
| 10950 |
Flash
[펌]겔러리에 적용하면 괜찮은 소스
3
|
| 10946 | |
| 24818 |
견적서
홈페이지 견적서입니다
11
|
| 10943 |
Flash
플래시 활성화 영역 안나오게 하기...
2
|
| 28885 |
JavaScript
외부의 이미지를 자신의 서버경로에 썸네일 만드는 방법
13
|
| 24813 | |
| 10940 | |
| 10927 |
JavaScript
포토샵질문드려요.
12
|
| 10925 |
Flash
FLEX 참고자료 URL
1
|
| 10920 |
JavaScript
이동도구(v)팁
4
|
| 10916 | |
| 10914 | |
| 10913 |
기타
FLEX 란?
|
| 10908 |
Flash
플래시 플레이어 오류발생할 때 패치
4
|
| 10905 | |
| 10904 | |
| 10899 | |
| 24803 | |
| 28882 |
HTML
링크클릭시 나타나는 점선 없애주기
2
|
| 10898 |
Flash
간단한 퀵메뉴
|
| 28878 |
기타
Ajax 마스터하기
3
|
| 28877 | |
| 24802 | |
| 24801 | |
| 24800 | |
| 24799 | |
| 10893 | |
| 10892 | |
| 24797 | |
| 24794 | |
| 10891 |
Flash
정상적인 사운드가 빠르게 재생될때
|
| 28871 |
HTML
id와 class의 차이점?
5
|
| 28870 | |
| 10881 |
MySQL
평가 표시 ★☆로 할 때
9
|
| 10872 | |
| 10870 | |
| 28868 | |
| 10868 |
JavaScript
3D 회전식 메뉴입니다. 드레그해서 붙혀서 사용해보세요
1
|
| 10866 | |
| 28862 |
HTML
Ajax로 만든 쇼핑몰입니다.
5
|
| 10864 |
기타
랜덤백그라운드
1
|
| 28861 |
HTML
마소 컬러 선택 대화상자
|
| 10863 |
기타
회원에게만 보여준다
|
| 28860 |
HTML
KOSDAQ소스
|
| 10862 |
JavaScript
ZDNet Korea레이어
|
| 28859 | |
| 28858 | |
| 10861 |
JavaScript
present[다음에서 발췌]
|
| 10859 | |
| 28856 |
HTML
클릭한 메뉴 고정하기
1
|
| 10857 |
JavaScript
클릭시 화면이 위로 올라가는 현상 막아주기
1
|
| 28854 | |
| 10856 |
기타
쿠키1년간체크
|
| 28853 |
HTML
자막파일(.smi) 싱크밀고 당기기
|
| 28852 |
JavaScript
일정시간동안 이미지 자동으로 변경하기
|
| 28851 |
HTML
이미지 파일 에러 처리
|
| 10855 |
JavaScript
이미지 미리 로딩시켜놓기
|
| 28850 |
HTML
웹로봇 배제 표준
|
| 10854 | |
| 28849 |
HTML
아이프레임하나만 새로고침하기
|
댓글 작성
댓글을 작성하시려면 로그인이 필요합니다.
로그인하기