링크된 텍스르 마우스 오버시 그림이 변한다.(메뉴로도..)

위챗(微信)에 공유

네로 | 2002.05.24 09:37:09 댓글: 0 조회: 368 추천: 9

분류컴관련 강좌·팁 https://life.moyiza.kr/itstudy/1746923

○ 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">

</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>

//////////////////////////////////

추천 (9) 선물 (0명)

한식기초요리 맑은국&토장국--韩式美味菜谱4-汤类（汉韩对照）입점신청

위챗 페이스북 트위터 웨이보 IP: ♡.99.♡.22

자료·공부 채널IT공부

총 3,006 개의 글이 있습니다.

제목	글쓴이	날짜	조회
처음 오신분들 필독!!![최종수정일:2003.9.21] 1		2003-09-20	11846
처음 오신분들 필독!!![최종수정일:2003.9.21] 9		2003-09-20	11396
처음 오신분들 필독!!![최종수정일:2003.10.26] 3		2003-09-20	20525
[SAP모임] SAP MM 자격증 공부 3	지구인	2010-08-27	19327
[SAP 모임] SAP 미니 프로젝트 진행 27	지구인	2009-09-07	13648
웹디자인 게시판 사용약관		2010-01-29	15602
공개소스 사용약관 1		2004-10-07	16702
276 [웹 디자인] 나만의 멋있는 이미지 꾸미기	네로	2002-05-29	2659
275 [웹 디자인] 이미지크기를 깔끔하게 바꿔봐요	네로	2002-05-27	2621
274 [웹 디자인] 그림으로 입체상자 만들기 1	네로	2002-05-27	2653
273 [웹 디자인] 말풍선 만들기	네로	2002-05-27	2653
272 [웹 디자인] 허접한 물방울 [펌]	네로	2002-05-24	3114
271 [컴관련 강좌·팁] 폼안의 텍스트 입력시 실시간 카운팅 ?	네로	2002-05-24	401
270 [컴관련 강좌·팁] Input, Textarea, Radiobutton, Checkbox등 disabled 옵션.	네로	2002-05-24	886
[컴관련 강좌·팁] 링크된 텍스르 마우스 오버시 그림이 변한다.(메뉴로도..)	네로	2002-05-24	368
268 [웹 프로그래밍] 세션을 이용한 로그인 로그아웃 마지막(로그아웃)	네로	2002-05-21	616
267 [웹 프로그래밍] 세션을 이용한 로그인 로그아웃 6번째(로그인)	네로	2002-05-21	495
266 [웹 프로그래밍] 세션을 이용한 로그인 로그아웃 5번째(회원체크)	네로	2002-05-21	674
265 [웹 프로그래밍] 세션을 이용한 로그인 로그 아웃 4번째 (회원 가입폼)	네로	2002-05-21	533
264 [웹 프로그래밍] 세션을 이용한 로그인 로그아웃 3번째	네로	2002-05-21	467
263 [웹 프로그래밍] 세션을 이용한 로그인 로그아웃 2번째	네로	2002-05-21	507
262 [웹 프로그래밍] 세션을 이용한 로그인 로그아웃 1번째	네로	2002-05-21	656
261 [컴관련 강좌·팁] [펌]img 태그에서 직접 border=0 지정않고 border=0 맹글어 주기..-_-	네로	2002-05-21	414
260 [컴관련 강좌·팁] IE6의 이미지 툴바 기능 막기(?)	네로	2002-05-21	357
259 [컴관련 강좌·팁] 한국 유명 웹에이젼시 구축사이트 모음 #2	네로	2002-05-21	577
258 [컴관련 강좌·팁] 한국 유명 웹에이젼시 구축사이트 모음 #1	네로	2002-05-21	693
257 [컴관련 강좌·팁] 탭키(tab) 눌렀을때 이동하는순서정하기..	네로	2002-05-21	528
256 [웹 프로그래밍] iis를 설치하기... 12		2002-05-20	3903