롤오버 이미지 질문좀 드릴께요 정보
롤오버 이미지 질문좀 드릴께요본문
http://cncgreen.co.kr/sub1_1.php
왼쪽 메뉴 부분 롤오버를 해논상태 입니다.
근데 제가 원하는건 롤오버 를해당페이지에 고정을 시키고싶어요 롤오버시 바뀐 이미지로
고정 시키고 다시 아래메뉴에 롤오버시 고정된 롤오버는 풀리고 모든메뉴에 마우스를 안올렸을시
다시 해당메뉴에 롤오버 이미지가 고정이되도록 해주고싶습니다.. 설명이 이상한가요ㅠㅠ ..
<!--
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_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_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_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('/images/sub1_left_04_on.jpg','/images/sub1_left_05_on.jpg','/images/sub1_left_06_on.jpg','/images/sub1_left_07_on.jpg','/images/sub3_left_04_on.jpg','/images/sub4_left_04_on.jpg','/images/sub4_left_05_on.jpg','/images/sub4_left_06_on.jpg','/images/sub4_left_07_on.jpg','/images/sub4_left_08_on.jpg','/images/sub4_left_09_on.jpg','/images/sub4_left_10_on.jpg','/images/sub4_left_11_on.jpg','/images/sub5_left_04_on.jpg','/images/sub5_left_05_on.jpg','/images/sub5_left_06_on.jpg','/images/sub5_left_07_on.jpg','/images/sub5_left_08_on.jpg','/images/sub5_left_09_on.jpg','/images/sub5_left_10_on.jpg','/images/sub5_left_11_on.jpg','/images/sub6_left_04_on.jpg','/images/sub6_left_05_on.jpg','/images/sub6_left_06_on.jpg')"> body 부분
<table width="280" border="0" cellspacing="0" cellpadding="0">
<tr>
<td width="58"> </td>
<td><table width="179" border="0" cellspacing="0" cellpadding="0">
<tr>
<td><img src="/images/sub1_left_02.jpg" width="179" height="63" /></td>
</tr>
<tr>
<td><a href="/sub1_1.php" onMouseOut="MM_swapImgRestore()" onMouseOver="MM_swapImage('Image1','','/images/sub1_left_04_on.jpg',1)"><img src="/images/sub1_left_04.jpg" name="Image1" width="179" height="35" border="0" id="Image13" /></a></td>
</tr>
<tr>
<td><a href="http://cncgreen.co.kr/sub1_2.php" onMouseOut="MM_swapImgRestore()" onMouseOver="MM_swapImage('Image2','','/images/sub1_left_05_on.jpg',1)"><img src="/images/sub1_left_05.jpg" name="Image2" width="179" height="35" border="0" id="Image14" /></a></td>
</tr>
<tr>
<td><a href="http://cncgreen.co.kr/sub1_3.php" onMouseOut="MM_swapImgRestore()" onMouseOver="MM_swapImage('Image3','','/images/sub1_left_06_on.jpg',1)"><img src="/images/sub1_left_06.jpg" name="Image3" width="179" height="35" border="0" id="Image15" /></a></td>
</tr>
<tr>
<td><a href="http://cncgreen.co.kr/sub1_4.php" onMouseOut="MM_swapImgRestore()" onMouseOver="MM_swapImage('Image4','','/images/sub1_left_07_on.jpg',1)"><img src="/images/sub1_left_07.jpg" name="Image4" width="179" height="35" border="0" id="Image16" /></a></td>
</tr>
</table></td>
<td width="43"> </td>
</tr>
</table> 해당 메뉴 부분이에요 ㅠㅠ.. 좀 뒤죽박중 이란 생각은 하지만
일단 롤오버는 되긴되요 롤오버를 처음써봐서 롤오버에 Image값도 제맘대로 줬어요..
고수님들 해결방안좀 제시해주세요
왼쪽 메뉴 부분 롤오버를 해논상태 입니다.
근데 제가 원하는건 롤오버 를해당페이지에 고정을 시키고싶어요 롤오버시 바뀐 이미지로
고정 시키고 다시 아래메뉴에 롤오버시 고정된 롤오버는 풀리고 모든메뉴에 마우스를 안올렸을시
다시 해당메뉴에 롤오버 이미지가 고정이되도록 해주고싶습니다.. 설명이 이상한가요ㅠㅠ ..
<!--
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_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_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_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('/images/sub1_left_04_on.jpg','/images/sub1_left_05_on.jpg','/images/sub1_left_06_on.jpg','/images/sub1_left_07_on.jpg','/images/sub3_left_04_on.jpg','/images/sub4_left_04_on.jpg','/images/sub4_left_05_on.jpg','/images/sub4_left_06_on.jpg','/images/sub4_left_07_on.jpg','/images/sub4_left_08_on.jpg','/images/sub4_left_09_on.jpg','/images/sub4_left_10_on.jpg','/images/sub4_left_11_on.jpg','/images/sub5_left_04_on.jpg','/images/sub5_left_05_on.jpg','/images/sub5_left_06_on.jpg','/images/sub5_left_07_on.jpg','/images/sub5_left_08_on.jpg','/images/sub5_left_09_on.jpg','/images/sub5_left_10_on.jpg','/images/sub5_left_11_on.jpg','/images/sub6_left_04_on.jpg','/images/sub6_left_05_on.jpg','/images/sub6_left_06_on.jpg')"> body 부분
<table width="280" border="0" cellspacing="0" cellpadding="0">
<tr>
<td width="58"> </td>
<td><table width="179" border="0" cellspacing="0" cellpadding="0">
<tr>
<td><img src="/images/sub1_left_02.jpg" width="179" height="63" /></td>
</tr>
<tr>
<td><a href="/sub1_1.php" onMouseOut="MM_swapImgRestore()" onMouseOver="MM_swapImage('Image1','','/images/sub1_left_04_on.jpg',1)"><img src="/images/sub1_left_04.jpg" name="Image1" width="179" height="35" border="0" id="Image13" /></a></td>
</tr>
<tr>
<td><a href="http://cncgreen.co.kr/sub1_2.php" onMouseOut="MM_swapImgRestore()" onMouseOver="MM_swapImage('Image2','','/images/sub1_left_05_on.jpg',1)"><img src="/images/sub1_left_05.jpg" name="Image2" width="179" height="35" border="0" id="Image14" /></a></td>
</tr>
<tr>
<td><a href="http://cncgreen.co.kr/sub1_3.php" onMouseOut="MM_swapImgRestore()" onMouseOver="MM_swapImage('Image3','','/images/sub1_left_06_on.jpg',1)"><img src="/images/sub1_left_06.jpg" name="Image3" width="179" height="35" border="0" id="Image15" /></a></td>
</tr>
<tr>
<td><a href="http://cncgreen.co.kr/sub1_4.php" onMouseOut="MM_swapImgRestore()" onMouseOver="MM_swapImage('Image4','','/images/sub1_left_07_on.jpg',1)"><img src="/images/sub1_left_07.jpg" name="Image4" width="179" height="35" border="0" id="Image16" /></a></td>
</tr>
</table></td>
<td width="43"> </td>
</tr>
</table> 해당 메뉴 부분이에요 ㅠㅠ.. 좀 뒤죽박중 이란 생각은 하지만
일단 롤오버는 되긴되요 롤오버를 처음써봐서 롤오버에 Image값도 제맘대로 줬어요..
고수님들 해결방안좀 제시해주세요
댓글 전체
css 로 하시는게 더 편하실꺼에요
a:hover{}
a:link{}
a:visited{}
a:active{}
a:hover{}
a:link{}
a:visited{}
a:active{}
음냐...
a:hover
하면 될걸, 저렇게 복잡하게 코딩 하는 방법도 있었나요? 우왕......
저 위에 쿠헹군님 예제 말고도
a:focus
도 자주 사용됩니다.
그리고 navigation (메뉴를) 저렇게 이미지 파일로 처리하는건 절대 안되는 겁니다. 이미지로 하실 이유가 하나도 없는데요? 검색 bot 들 보러 어떻게 돌아다니라고 저렇게 dead link 를 만드시나요?
a:hover
하면 될걸, 저렇게 복잡하게 코딩 하는 방법도 있었나요? 우왕......
저 위에 쿠헹군님 예제 말고도
a:focus
도 자주 사용됩니다.
그리고 navigation (메뉴를) 저렇게 이미지 파일로 처리하는건 절대 안되는 겁니다. 이미지로 하실 이유가 하나도 없는데요? 검색 bot 들 보러 어떻게 돌아다니라고 저렇게 dead link 를 만드시나요?
네 근데 이미 스크립트로 해놔서요 이걸로 해보고 싶어서 ㅠㅠ...
저거는 사람이 hard coding 한게 아니고 드림위버에서 generate 된거니까 다시 드림위버로 go back 하셔서 해결보시면 될 것 같습니다.
네 드림위버로 해온거 맞는데 제가 드림위버는 사용할줄몰라서요.. ㅠㅠ
.js 로는 (jQuery 로도 가능합니다.)
onmouseover="freezeImage()"
예:
<div class="Link" onmouseover="freezeImage()" >씨엔시푸른병원 이년</div>
이렇게 하시면 됩니다. 저위 스크립에는 어떻게 적용할지... 모르겠네요.
드림위버 포럼가셔서 물어보셔야 할거에요.
onmouseover="freezeImage()"
예:
<div class="Link" onmouseover="freezeImage()" >씨엔시푸른병원 이년</div>
이렇게 하시면 됩니다. 저위 스크립에는 어떻게 적용할지... 모르겠네요.
드림위버 포럼가셔서 물어보셔야 할거에요.
답변해주셔서 감사해요 ㅠ ㅠ 지금 그냥 스타일시트 이용해서 하려고 해요 답변해주신분들 감사합니다~