html 롤오버 질문 드립니다 정보
html 롤오버 질문 드립니다본문
롤오버 클릭 후에 오버된 이미지가 그대로 남아 있게 하고 싶은데요,
현재 include는 top_menu.php 와 sub1,sub2,sub3,sub4 이런식으로 php를 불러오게끔 작업하였습니다.
해당 소스는
-top_menu.php-
<script type="text/javascript">
function MM_swapImgRestore() { //v3.0
var i,x,a=document.MM_sr; for(i=0;a&&i<a.length&&(x=a[i])&&x.oSrc;i++) x.src=x.oSrc;
}
function MM_preloadImages() { //v3.0
var d=document; if(d.images){ if(!d.MM_p) d.MM_p=new Array();
var i,j=d.MM_p.length,a=MM_preloadImages.arguments; for(i=0; i<a.length; i++)
if (a[i].indexOf("#")!=0){ d.MM_p[j]=new Image; d.MM_p[j++].src=a[i];}}
}
function MM_findObj(n, d) { //v4.01
var p,i,x; if(!d) d=document; if((p=n.indexOf("?"))>0&&parent.frames.length) {
d=parent.frames[n.substring(p+1)].document; n=n.substring(0,p);}
if(!(x=d[n])&&d.all) x=d.all[n]; for (i=0;!x&&i<d.forms.length;i++) x=d.forms[i][n];
for(i=0;!x&&d.layers&&i<d.layers.length;i++) x=MM_findObj(n,d.layers[i].document);
if(!x && d.getElementById) x=d.getElementById(n); return x;
}
function MM_swapImage() { //v3.0
var i,j=0,x,a=MM_swapImage.arguments; document.MM_sr=new Array; for(i=0;i<(a.length-2);i+=3)
if ((x=MM_findObj(a[i]))!=null){document.MM_sr[j++]=x; if(!x.oSrc) x.oSrc=x.src; x.src=a[i+2];}
}
</script>
<body onLoad="MM_preloadImages('../image/sample/btn_company_o.png','../image/sample/btn_artist_o.png','../image/sample/btn_video_o.png','../image/sample/btn_news_o.png','../image/sample/btn_audition_o.png')"><div id="top">
<div id="top_quick">
<!--고정 퀵메뉴출력-->
<img src="../image/sample/top_qmenu.png" width="320" height="50" border="0">
</div>
<div id="top_menu" style="width:990px; height:92px;">
<!-- 메뉴출력 -->
<div class="moveent" style="width:140px; height:60px; margin-top:20px; margin-left:20px; float:left;">
<a href="/"><img src="../image/sample/logo.png" width="140" height="60"> </a>
</div>
<div class="top_btn" style=" float:left; margin-top:50px; margin-left:200px;">
<div style="width:145px; float:left;">
<a href="/bbs/board.php?bo_table=0101&wr_id=1" onMouseOut="MM_swapImgRestore()" onMouseOver="MM_swapImage('company','','../image/sample/btn_company_o.png',1)"><img src="../image/sample/btn_company<?=$bo_table=='0101' ? '_o' : '';?>.png" width="130" height="25" id="company" /></a>
</div>
<div style="width:115px; float:left;">
<a href="/bbs/board.php?bo_table=0201&wr_id=1" onMouseOut="MM_swapImgRestore()" onMouseOver="MM_swapImage('artist','','../image/sample/btn_artist_o.png',1)"><img src="../image/sample/btn_artist<?=$bo_table=='0201' ? '_o' : '';?>.png" width="100" height="25" id="artist" /></a>
</div>
<div style="width:95px; float:left;">
<a href="/bbs/board.php?bo_table=0301&wr_id=1" onMouseOut="MM_swapImgRestore()" onMouseOver="MM_swapImage('video','','../image/sample/btn_video_o.png',1)"><img src="../image/sample/btn_video<?=$bo_table=='0301' ? '_o' : '';?>.png" width="80" height="25" id="video" /></a>
</div>
<div style="width:95px; float:left;">
<a href="/bbs/board.php?bo_table=0401" onMouseOut="MM_swapImgRestore()" onMouseOver="MM_swapImage('news','','../image/sample/btn_news_o.png',1)"><img src="../image/sample/btn_news<?=$bo_table=='0401' ? '_o' : '';?>.png" width="80" height="25" id="news" /></a>
</div>
<div style="width:135px; float:left;">
<a href="/bbs/board.php?bo_table=0503&wr_id=1" onMouseOut="MM_swapImgRestore()" onMouseOver="MM_swapImage('audition','','../image/sample/btn_audition_o.png',1)"><img src="../image/sample/btn_audition<?=$bo_table=='0503' ? '_o' : '';?>.png" width="120" height="25" id="audition" /></a>
</div>
</div>
</div>
</div>
이며 서브는
<!---------- 서브탑 ---------->
<div id="sub_top_img" style="background-image:url('../image/sub_top_img1.png'); background-repeat:no-repeat; background-position:50% 0%;">
<? include "../inc/top_menu.php"; ?>
</div>
<div id="sub_top_line">
<div id="content">
<!---------- 서브 좌측 시작 ---------->
<div id="sub_left">
<!--- 서브메뉴출력 --->
<div id="sub_menu">
<img src="../image/smenu/title1.png" width="190" height="42" border="0">
<table cellpadding="0" cellspacing="0" width="190">
<tr>
<td height="40"></td>
</tr>
<tr>
<td align="right"><img src="../image/smenu/line.png" width="190" height="2" border="0"></td>
</tr>
<tr>
<td align="right"><a onfocus=blur() href="/bbs/board.php?bo_table=0101&wr_id=1"><img src="../image/smenu/company<?=$bo_table=='0101' ? '_o' : '';?>.png" width="187" height="33" border="0" onMouseOver='this.src="../image/smenu/company_o.png"' onMOuseOut='this.src="../image/smenu/company.png"'></a></td>
</tr>
<tr>
<td align="right"><img src="../image/smenu/line.png" width="190" height="2" border="0"></td>
</tr>
<tr>
<td align="right"><a onfocus=blur() href="/bbs/board.php?bo_table=0102&wr_id=1"><img src="../image/smenu/history<?=$bo_table=='0102' ? '_o' : '';?>.png" width="187" height="33" border="0" onMouseOver='this.src="../image/smenu/history_o.png"' onMOuseOut='this.src="../image/smenu/history.png"'></a></td>
</tr>
<tr>
<td align="right"><img src="../image/smenu/line.png" width="190" height="2" border="0"></td>
</tr>
<tr>
<td align="right"><a onfocus=blur() href="/bbs/board.php?bo_table=0103&wr_id=1"><img src="../image/smenu/contact<?=$bo_table=='0103' ? '_o' : '';?>.png" width="187" height="33" border="0" onMouseOver='this.src="../image/smenu/contact_o.png"' onMOuseOut='this.src="../image/smenu/contact.png"'></a></td>
</tr>
<tr>
<td align="right"><img src="../image/smenu/line.png" width="190" height="2" border="0"></td>
</tr>
<tr>
<td height="40"></td>
</tr>
</table>
</div>
<img src="../image/smenu/bg_bottom.png" width="190" height="33" border="0">
<!---배너출력--->
<? include "../inc/sub_left_banner.php"; ?>
</div>
<!---------- 서브 우측 시작 ---------->
<div id="sub_center">
<table align="center" cellpadding="0" cellspacing="0" width="740" height="500">
<tr>
<td valign="top">
<!--- 페이지 타이틀출력 --->
<?
switch($bo_table){
case "0101":
echo ("<img src='".$g4['path']."/image/title/11.gif'>");
break;
case "0102":
echo ("<img src='".$g4['path']."/image/title/12.gif'>");
break;
case "0103":
echo ("<img src='".$g4['path']."/image/title/13.gif'>");
break;
case "0104":
echo ("<img src='".$g4['path']."/image/title/14.gif'>");
break;
case "0105":
echo ("<img src='".$g4['path']."/image/title/15.gif'>");
break;
case "0106":
echo ("<img src='".$g4['path']."/image/title/16.gif'>");
break;
case "0107":
echo ("<img src='".$g4['path']."/image/title/17.gif'>");
break;
case "0108":
echo ("<img src='".$g4['path']."/image/title/18.gif'>");
break;
}
?><br>
이런식으로 진행됩니다.
http://moveent.dothome.co.kr
이며 서브메뉴에서 1번을 제외한 2,3, 번 클릭시 상단 top_menu 의 오버된 이미지가 사라지는데
계속해서 남아있게 하려면 어떻게 수정해야 하나요?
부탁드립니다.
현재 include는 top_menu.php 와 sub1,sub2,sub3,sub4 이런식으로 php를 불러오게끔 작업하였습니다.
해당 소스는
-top_menu.php-
<script type="text/javascript">
function MM_swapImgRestore() { //v3.0
var i,x,a=document.MM_sr; for(i=0;a&&i<a.length&&(x=a[i])&&x.oSrc;i++) x.src=x.oSrc;
}
function MM_preloadImages() { //v3.0
var d=document; if(d.images){ if(!d.MM_p) d.MM_p=new Array();
var i,j=d.MM_p.length,a=MM_preloadImages.arguments; for(i=0; i<a.length; i++)
if (a[i].indexOf("#")!=0){ d.MM_p[j]=new Image; d.MM_p[j++].src=a[i];}}
}
function MM_findObj(n, d) { //v4.01
var p,i,x; if(!d) d=document; if((p=n.indexOf("?"))>0&&parent.frames.length) {
d=parent.frames[n.substring(p+1)].document; n=n.substring(0,p);}
if(!(x=d[n])&&d.all) x=d.all[n]; for (i=0;!x&&i<d.forms.length;i++) x=d.forms[i][n];
for(i=0;!x&&d.layers&&i<d.layers.length;i++) x=MM_findObj(n,d.layers[i].document);
if(!x && d.getElementById) x=d.getElementById(n); return x;
}
function MM_swapImage() { //v3.0
var i,j=0,x,a=MM_swapImage.arguments; document.MM_sr=new Array; for(i=0;i<(a.length-2);i+=3)
if ((x=MM_findObj(a[i]))!=null){document.MM_sr[j++]=x; if(!x.oSrc) x.oSrc=x.src; x.src=a[i+2];}
}
</script>
<body onLoad="MM_preloadImages('../image/sample/btn_company_o.png','../image/sample/btn_artist_o.png','../image/sample/btn_video_o.png','../image/sample/btn_news_o.png','../image/sample/btn_audition_o.png')"><div id="top">
<div id="top_quick">
<!--고정 퀵메뉴출력-->
<img src="../image/sample/top_qmenu.png" width="320" height="50" border="0">
</div>
<div id="top_menu" style="width:990px; height:92px;">
<!-- 메뉴출력 -->
<div class="moveent" style="width:140px; height:60px; margin-top:20px; margin-left:20px; float:left;">
<a href="/"><img src="../image/sample/logo.png" width="140" height="60"> </a>
</div>
<div class="top_btn" style=" float:left; margin-top:50px; margin-left:200px;">
<div style="width:145px; float:left;">
<a href="/bbs/board.php?bo_table=0101&wr_id=1" onMouseOut="MM_swapImgRestore()" onMouseOver="MM_swapImage('company','','../image/sample/btn_company_o.png',1)"><img src="../image/sample/btn_company<?=$bo_table=='0101' ? '_o' : '';?>.png" width="130" height="25" id="company" /></a>
</div>
<div style="width:115px; float:left;">
<a href="/bbs/board.php?bo_table=0201&wr_id=1" onMouseOut="MM_swapImgRestore()" onMouseOver="MM_swapImage('artist','','../image/sample/btn_artist_o.png',1)"><img src="../image/sample/btn_artist<?=$bo_table=='0201' ? '_o' : '';?>.png" width="100" height="25" id="artist" /></a>
</div>
<div style="width:95px; float:left;">
<a href="/bbs/board.php?bo_table=0301&wr_id=1" onMouseOut="MM_swapImgRestore()" onMouseOver="MM_swapImage('video','','../image/sample/btn_video_o.png',1)"><img src="../image/sample/btn_video<?=$bo_table=='0301' ? '_o' : '';?>.png" width="80" height="25" id="video" /></a>
</div>
<div style="width:95px; float:left;">
<a href="/bbs/board.php?bo_table=0401" onMouseOut="MM_swapImgRestore()" onMouseOver="MM_swapImage('news','','../image/sample/btn_news_o.png',1)"><img src="../image/sample/btn_news<?=$bo_table=='0401' ? '_o' : '';?>.png" width="80" height="25" id="news" /></a>
</div>
<div style="width:135px; float:left;">
<a href="/bbs/board.php?bo_table=0503&wr_id=1" onMouseOut="MM_swapImgRestore()" onMouseOver="MM_swapImage('audition','','../image/sample/btn_audition_o.png',1)"><img src="../image/sample/btn_audition<?=$bo_table=='0503' ? '_o' : '';?>.png" width="120" height="25" id="audition" /></a>
</div>
</div>
</div>
</div>
이며 서브는
<!---------- 서브탑 ---------->
<div id="sub_top_img" style="background-image:url('../image/sub_top_img1.png'); background-repeat:no-repeat; background-position:50% 0%;">
<? include "../inc/top_menu.php"; ?>
</div>
<div id="sub_top_line">
<div id="content">
<!---------- 서브 좌측 시작 ---------->
<div id="sub_left">
<!--- 서브메뉴출력 --->
<div id="sub_menu">
<img src="../image/smenu/title1.png" width="190" height="42" border="0">
<table cellpadding="0" cellspacing="0" width="190">
<tr>
<td height="40"></td>
</tr>
<tr>
<td align="right"><img src="../image/smenu/line.png" width="190" height="2" border="0"></td>
</tr>
<tr>
<td align="right"><a onfocus=blur() href="/bbs/board.php?bo_table=0101&wr_id=1"><img src="../image/smenu/company<?=$bo_table=='0101' ? '_o' : '';?>.png" width="187" height="33" border="0" onMouseOver='this.src="../image/smenu/company_o.png"' onMOuseOut='this.src="../image/smenu/company.png"'></a></td>
</tr>
<tr>
<td align="right"><img src="../image/smenu/line.png" width="190" height="2" border="0"></td>
</tr>
<tr>
<td align="right"><a onfocus=blur() href="/bbs/board.php?bo_table=0102&wr_id=1"><img src="../image/smenu/history<?=$bo_table=='0102' ? '_o' : '';?>.png" width="187" height="33" border="0" onMouseOver='this.src="../image/smenu/history_o.png"' onMOuseOut='this.src="../image/smenu/history.png"'></a></td>
</tr>
<tr>
<td align="right"><img src="../image/smenu/line.png" width="190" height="2" border="0"></td>
</tr>
<tr>
<td align="right"><a onfocus=blur() href="/bbs/board.php?bo_table=0103&wr_id=1"><img src="../image/smenu/contact<?=$bo_table=='0103' ? '_o' : '';?>.png" width="187" height="33" border="0" onMouseOver='this.src="../image/smenu/contact_o.png"' onMOuseOut='this.src="../image/smenu/contact.png"'></a></td>
</tr>
<tr>
<td align="right"><img src="../image/smenu/line.png" width="190" height="2" border="0"></td>
</tr>
<tr>
<td height="40"></td>
</tr>
</table>
</div>
<img src="../image/smenu/bg_bottom.png" width="190" height="33" border="0">
<!---배너출력--->
<? include "../inc/sub_left_banner.php"; ?>
</div>
<!---------- 서브 우측 시작 ---------->
<div id="sub_center">
<table align="center" cellpadding="0" cellspacing="0" width="740" height="500">
<tr>
<td valign="top">
<!--- 페이지 타이틀출력 --->
<?
switch($bo_table){
case "0101":
echo ("<img src='".$g4['path']."/image/title/11.gif'>");
break;
case "0102":
echo ("<img src='".$g4['path']."/image/title/12.gif'>");
break;
case "0103":
echo ("<img src='".$g4['path']."/image/title/13.gif'>");
break;
case "0104":
echo ("<img src='".$g4['path']."/image/title/14.gif'>");
break;
case "0105":
echo ("<img src='".$g4['path']."/image/title/15.gif'>");
break;
case "0106":
echo ("<img src='".$g4['path']."/image/title/16.gif'>");
break;
case "0107":
echo ("<img src='".$g4['path']."/image/title/17.gif'>");
break;
case "0108":
echo ("<img src='".$g4['path']."/image/title/18.gif'>");
break;
}
?><br>
이런식으로 진행됩니다.
http://moveent.dothome.co.kr
이며 서브메뉴에서 1번을 제외한 2,3, 번 클릭시 상단 top_menu 의 오버된 이미지가 사라지는데
계속해서 남아있게 하려면 어떻게 수정해야 하나요?
부탁드립니다.
댓글 전체