<!DOCTYPE html>
<html>
<head>
<script type="text/javascript">
var TimeOut = 300;
var currentLayer = null;
var currentitem = null;
var currentLayerNum = 0;
var noClose = 0;
var closeTimer = null;
function mopen(n) {
var l = document.getElementById("menu"+n);
var mm = document.getElementById("mmenu"+n);
if(l) {
mcancelclosetime();
l.style.visibility='visible';
if(currentLayer && (currentLayerNum != n))
currentLayer.style.visibility='hidden';
currentLayer = l;
currentitem = mm;
currentLayerNum = n;
} else if(currentLayer) {
currentLayer.style.visibility='hidden';
currentLayerNum = 0;
currentitem = null;
currentLayer = null;
}
}
function mclosetime() {
closeTimer = window.setTimeout(mclose, TimeOut);
}
function mcancelclosetime() {
if(closeTimer) {
window.clearTimeout(closeTimer);
closeTimer = null;
}
}
function mclose() {
if(currentLayer && noClose!=1) {
currentLayer.style.visibility='hidden';
currentLayerNum = 0;
currentLayer = null;
currentitem = null;
} else {
noClose = 0;
}
currentLayer = null;
currentitem = null;
}
document.onclick = mclose;
</script>
<style type="text/css">
#ddd { margin: 0; padding: 0 }
#ddd li{ margin: 0; padding: 0; list-style: none; float: left; font: bold 12px 굴림 }
#ddd li a.menu1{ display: block; text-align: center; background: #ffffff; padding: 0px 1px; margin: 0 1px 0 0; color: #FFF; width: 960px; text-decoration: none}
#ddd li a.menu:hover{ background: #49A3FF }
.submenu{
background: #009ee2;
border: 0px solid #5E5E5E;
width:924px;
visibility: hidden;
position: absolute;
z-index: 3;
left: 28px;
height: 81px;
}
.submenu a { display: block; font: 12px 굴림; text-align: left; width:130px; text-decoration: none; padding: 1px; color: #ffffff }
.submenu a:hover { width:500px; background: #49A3FF; color: #FFF }
</style>
</head>
<body>
<!--begin wijmo menu-->
<ul id="ddd">
<li><a href="#" class="menu1" id="mmenu1" onmouseover="mopen(1);" onmouseout="mclosetime();"><img src="menu.gif" width="960" border="0"></a>
<div class="submenu" id="menu1" onmouseover="mcancelclosetime()" onmouseout="mclosetime();">
<a href="#">회사 소개</a><a href="#">회사 소개</a>
<a href="#">오시는 길</a>
</div>
</li>
</ul>
<!--end wijmo menu-->
</body>
</html>
=====================================================================================
위 소스를 통해
제가 디자인한 메뉴처럼 만들수 없을가요??
전체적인 메뉴가 펼쳐지는 것이지요.
<html>
<head>
<script type="text/javascript">
var TimeOut = 300;
var currentLayer = null;
var currentitem = null;
var currentLayerNum = 0;
var noClose = 0;
var closeTimer = null;
function mopen(n) {
var l = document.getElementById("menu"+n);
var mm = document.getElementById("mmenu"+n);
if(l) {
mcancelclosetime();
l.style.visibility='visible';
if(currentLayer && (currentLayerNum != n))
currentLayer.style.visibility='hidden';
currentLayer = l;
currentitem = mm;
currentLayerNum = n;
} else if(currentLayer) {
currentLayer.style.visibility='hidden';
currentLayerNum = 0;
currentitem = null;
currentLayer = null;
}
}
function mclosetime() {
closeTimer = window.setTimeout(mclose, TimeOut);
}
function mcancelclosetime() {
if(closeTimer) {
window.clearTimeout(closeTimer);
closeTimer = null;
}
}
function mclose() {
if(currentLayer && noClose!=1) {
currentLayer.style.visibility='hidden';
currentLayerNum = 0;
currentLayer = null;
currentitem = null;
} else {
noClose = 0;
}
currentLayer = null;
currentitem = null;
}
document.onclick = mclose;
</script>
<style type="text/css">
#ddd { margin: 0; padding: 0 }
#ddd li{ margin: 0; padding: 0; list-style: none; float: left; font: bold 12px 굴림 }
#ddd li a.menu1{ display: block; text-align: center; background: #ffffff; padding: 0px 1px; margin: 0 1px 0 0; color: #FFF; width: 960px; text-decoration: none}
#ddd li a.menu:hover{ background: #49A3FF }
.submenu{
background: #009ee2;
border: 0px solid #5E5E5E;
width:924px;
visibility: hidden;
position: absolute;
z-index: 3;
left: 28px;
height: 81px;
}
.submenu a { display: block; font: 12px 굴림; text-align: left; width:130px; text-decoration: none; padding: 1px; color: #ffffff }
.submenu a:hover { width:500px; background: #49A3FF; color: #FFF }
</style>
</head>
<body>
<!--begin wijmo menu-->
<ul id="ddd">
<li><a href="#" class="menu1" id="mmenu1" onmouseover="mopen(1);" onmouseout="mclosetime();"><img src="menu.gif" width="960" border="0"></a>
<div class="submenu" id="menu1" onmouseover="mcancelclosetime()" onmouseout="mclosetime();">
<a href="#">회사 소개</a><a href="#">회사 소개</a>
<a href="#">오시는 길</a>
</div>
</li>
</ul>
<!--end wijmo menu-->
</body>
</html>
=====================================================================================
위 소스를 통해
제가 디자인한 메뉴처럼 만들수 없을가요??
전체적인 메뉴가 펼쳐지는 것이지요.
게시글 목록
| 번호 | 제목 |
|---|---|
| 284438 | |
| 284437 | |
| 284435 | |
| 284430 | |
| 284420 | |
| 284417 | |
| 284409 | |
| 284401 | |
| 284399 | |
| 284397 | |
| 284380 | |
| 284378 | |
| 284371 | |
| 284370 | |
| 284366 | |
| 284364 | |
| 284360 | |
| 284357 | |
| 284355 | |
| 284354 |
댓글 작성
댓글을 작성하시려면 로그인이 필요합니다.
로그인하기