메뉴 건너뛰기

2021.05.31 16:12

6장 예제 6-2 질문

조회 수 30 댓글 1

<!DOCTYPE html>
<html>
<head>
<meta charset="UTF-8">
<title>script 태그에 자바스크립트 작성</title>
<script>
function over(obj) {
    obj.src="media/banana.png";
}
function out(obj) {
    obj.src="media/apple.png";
}

</script>
</head>
<body>
<h3>마우스 올려 보세요</h3>
<hr>
<img src="media/apple.png" alt="이미지"
        onmouseover="over(this)"
        onmouseout="out(this)">
</body>
</html>

 

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

책에 나와있는 예제 6-2의 코드입니다.

이미 사과 이미지를 배치했는데

왜 따로 function out(obj) {
    obj.src="media/apple.png";} 
를 주어야 하는가요? 

빨간색 부분의 코드를 지워도 결과는 똑같은데 무슨 차이, 이유가 있는건가요?

 

공부하다가 궁금해서 질문합니다!!

?
  • ?
    관리자 2021.05.31 18:59
    out() 함수는 이미지에서 마우스를 다른 곳으로 이동시키면 발생하는 MOUSE OUT 이벤트를 처리하는 함수입니다.
    만일 out() 함수가 없다면, 마우스를 이미지 위에 올려 바나나가 출력되고 그 후 마우스를 다른 곳으로 옮겨도 사과 이미지로 돌아오지 않습니다.
    out()은 마우스를 다른 곳으로 옮겼을 때 이미지 태그에 사과를 출력하기 위한 것입니다.

    이 예제의 목적은 MOUSE OVER 이벤트와 MOUSE OUT 이벤트의 발생을 확인하는데 있습니다.
    혹시 이 대답이 부족하거나 질문자의 의도를 제가 잘 이해못하였다면
    다시 질문 주세요.

QnA

공부하면서 궁금했던 것을 질문해보세요.

List of Articles
번호 제목 글쓴이 날짜 조회 수
공지 읽어주세요! 연습문제 및 실습문제 정답 공개에 관한 공지입니다. file 관리자 2017.06.20 11939
344 9 - 15 코드 개선 질문있습니다. 1 new killchain 2021.06.17 3
343 6장 실습문제 4번 1 김성준 2021.06.16 8
342 6장 OPEN challenge 1 초보 2021.06.09 26
341 9장 실습문제 10번 질문이요 2 mmii 2021.06.06 44
» 6장 예제 6-2 질문 1 릴릴 2021.05.31 30
339 교과서 13장 연습문제 1 알고싶어요 2021.05.29 47
338 이벤트 흐름 1 궁금이 2021.05.28 16
337 8장 실습문제 8번 질문이요! 3 mmii 2021.05.28 67
336 14장 소스코드 제공에 대해 질문합니다. 1 질문자 2021.05.25 30
335 10장 예제 10-8에 오류가 있습니다. 1 file 삼오칠 2021.05.22 87
334 9장 예제 9-10질문입니다. 1 file 삼오칠 2021.05.14 88
333 6장 openchallenge 1 ㅇㅇ 2021.05.06 70
332 명품 수정판 HTML5+ CSS3+ Javascript 웹 프로그래밍 p.74 메타 데이터 <meta> 문의 1 mikael 2021.05.06 36
331 오류 - 6장 3.식과 연산자 - 비트 논리 연산 1 김성필 2021.04.27 43
330 4장 예제 4-17질문입니다. 1 file Escui 2021.04.22 54
329 [명품 html5+ css3+ javascript 웹 프로그래밍 수정판] 1장 실습문제 4번 질문합니다... 2 file 나능냐공도리 2021.04.17 105
328 명품 html5+ 수정판 p.89 예제 2-21 파일 다운로드 링크 만들기 실행 오류 문의 1 file mikael 2021.04.15 38
327 명품 HTML5+ 수정판 2장 4번 문제 문의 1 file mikael 2021.04.14 56
326 명품 html5+ css3+ javascript 웹 프로그래밍 수정판 문제 실행 오류 문의 1 file mikael 2021.04.14 36
325 2-21 예제 3 file Iwanteating 2021.03.25 90
목록
Board Pagination Prev 1 2 3 4 5 6 7 8 9 10 ... 18 Next
/ 18
위로