웹마스터 팁
page_full_width" class="col-xs-12" |cond="$__Context->page_full_width">
링크된 텍스르 마우스 오버시 그림이 변한다.(메뉴로도..)
2002.05.19 15:08
예제: http://yoonmi.net/study/study46.htm
○ pic0.src = "img1.gif"; // 기본 그림
○ pic1.src = "img2.gif"; // 문구에 마우스 오버시 나타날 두 번째 그림
좀더 링크 시킬 문구와 변할 그림을 늘리고 싶다면, 숫자만 하나씩 올려서 추가해주면 되겠죠.
예를 들어.
....
pic1 = new Image();
pic1.src = "img2.gif";
pic2 = new Image();
pic2.src = "img3.gif";
.....
이런식으로요.
물론, 밑에 바디 부분도 추가해 주는 것은 당연합니다. img1.gif 부분은 처음 나올 그림 주소쓰구요.
링크할 주소, 링크시킬 문구 도 적절히 변혀 시켜주세요.
만약 위에 처럼 이미지 변경을 하나더 추가했다면
<td valign="center">
<a href="링크할 주소" onmouseover="document.images.text.src=pic2.src" onmouseout="document.images.text.src=pic0.src" target="_top">링크시킬 문구 2, 3, ....</a>
</td>
요걸 반복해 주면 됩니다.
<head> 와 </head> 사이에 입력하세요.
/////////////////////////////
<script language="JavaScript">
<!--
pic0 = new Image();
pic0.src = "img1.gif";
pic1 = new Image();
pic1.src = "img2.gif";
// -->
</script>
///////////////////////////////////
<body> 와 </body>사이에 추가해주세요.
///////////////////////////////////
<table>
<tr>
<td id="textbox" align="center" >
<img src="img1.gif" name="text" border="0"></td>
<td valign="center">
<a href="링크할 주소" onmouseover="document.images.text.src=pic1.src" onmouseout="document.images.text.src=pic0.src" target="_top">링크시킬 문구</a>
</td>
</tr>
</table>
//////////////////////////////////
○ pic0.src = "img1.gif"; // 기본 그림
○ pic1.src = "img2.gif"; // 문구에 마우스 오버시 나타날 두 번째 그림
좀더 링크 시킬 문구와 변할 그림을 늘리고 싶다면, 숫자만 하나씩 올려서 추가해주면 되겠죠.
예를 들어.
....
pic1 = new Image();
pic1.src = "img2.gif";
pic2 = new Image();
pic2.src = "img3.gif";
.....
이런식으로요.
물론, 밑에 바디 부분도 추가해 주는 것은 당연합니다. img1.gif 부분은 처음 나올 그림 주소쓰구요.
링크할 주소, 링크시킬 문구 도 적절히 변혀 시켜주세요.
만약 위에 처럼 이미지 변경을 하나더 추가했다면
<td valign="center">
<a href="링크할 주소" onmouseover="document.images.text.src=pic2.src" onmouseout="document.images.text.src=pic0.src" target="_top">링크시킬 문구 2, 3, ....</a>
</td>
요걸 반복해 주면 됩니다.
<head> 와 </head> 사이에 입력하세요.
/////////////////////////////
<script language="JavaScript">
<!--
pic0 = new Image();
pic0.src = "img1.gif";
pic1 = new Image();
pic1.src = "img2.gif";
// -->
</script>
///////////////////////////////////
<body> 와 </body>사이에 추가해주세요.
///////////////////////////////////
<table>
<tr>
<td id="textbox" align="center" >
<img src="img1.gif" name="text" border="0"></td>
<td valign="center">
<a href="링크할 주소" onmouseover="document.images.text.src=pic1.src" onmouseout="document.images.text.src=pic0.src" target="_top">링크시킬 문구</a>
</td>
</tr>
</table>
//////////////////////////////////
제목 | 글쓴이 | 날짜 |
---|---|---|
보안설정을 하다^^ 유의할점. [3] | Dopesoul | 2002.10.14 |
오 이런... 죄송하군요 ㅠ.ㅜ [2] | 레드 | 2002.10.12 |
나만의 ftp서버 만들기 제2부 -serv-u 4.0- [12] | 레드 | 2002.10.09 |
나만의 ftp서버 만들기 제1부 -serv-u 4.0- [1] | 레드 | 2002.10.09 |
추천해드리는 보안공부 사이트 [3] | Dopesoul | 2002.10.05 |
리눅스 넋두리. [4] | Dopesoul | 2002.10.05 |
Redhat 8.0 release! [22] | Dopesoul | 2002.10.01 |
리눅스용 apm 자동설치 스크립트 [10] | 이경재 | 2002.09.27 |
웹호스팅할때 좋은 간단한 백업스크립트 [1] | 김동현 | 2002.09.22 |
웹호스팅꽁수! 어느사용자가 얼만큼의 하드용량을 쓰고있는가? 알아봅시다. [1] | Dopesoul | 2002.09.22 |
War3 베틀넷 운영 [5] | Dopesoul | 2002.09.20 |
운영체제별 보안 참조사이트 [4] | V(^o^)V | 2002.09.16 |
apache + php + mysql + gd + freetype 설치 방법 [1] | 꽃게BBS | 2002.09.16 |
PC 한 대에 2 개 또는 그 이상의 랜카드 꽂고 서버 운영하기. [2] | 김종환 | 2002.09.15 |
자동 apm 설치 쉘스크립트(리눅스) [5] | 김동현 | 2002.09.15 |
Win2k 터미널 서비스 연결시 MsTsc.Server 에러 때려잡기!! | KKwang | 2002.09.10 |
레드헷 계열 사용하시는 분들 웹서버에 대해서...(APM연동) [11] | lanyan | 2002.09.10 |
[re] 레드헷 계열 사용하시는 분들 웹서버에 대해서...(APM연동) | Dopesoul | 2002.09.14 |
PHP에서의 SQL문 보안취약성 [5] | 김영빈 | 2002.09.09 |
[Apache] 윈도우 NT 계열에 서비스 등록하기 [1] | 스카이 | 2002.09.08 |