메뉴 건너뛰기

조회 수 323 댓글 2

page 46 그대로 따라 작성한 후 이미지 파일을 같은 폴더에 ElvisPresley.png 이미지 넣은 후 html 작성해 봤더니 마우스 올려대도 이미지가 안나오네요.

혹시 제가 잘못 작성한게 있을까요?

<!DOCTYPE html>
<html>
<head>
<title>웹 페이지의 구성 요소</title>
<style>
    body {background-color: linen; color : green;
            margin-left: 40px; margin-right: 40px;}
    h3 { text-align: center; color : darkred; }
    hr {height: 5px; border : solid grey;
        background-color: grey}
    span{color : blue; font-size: 20px;}
</style>
<script>
    function show(){
        document.getElementById("fig").src="ElvisPresley.png";
    }
    function hide(){
        document.getElementById("fig").src"";
    }
</script>
</head>
<body>
<h3 onmouseover = "show()" onmouseout="hide()">
    Elvis Presley</h3>
<hr>
<div><img id="fig" src=""></div>
He was an American singer and actor. In November
1956, he made his film debut in <span>Love Me
Tender</span>. He is often referred to as
"<span>the King of Rock and Roll</span>"
</body>
</html>

c드라이브 web폴더를 만들어 거기에 html과 이미지 파일 같이 넣어놨습니다

?
  • ?
    공부중 2020.09.10 16:08
    다시 싹다 지우고 작성해보니 요번에는 그림이 나오네요 오류였던건가요?
  • ?
    관리자 2020.09.10 18:24
    1. 잘못 타이핑된 부분이 있습니다. 아래서 = 이 빠졌네요.

    function hide(){
    document.getElementById("fig").src""; // =이 빠졌네요

    -->
    function hide(){
    document.getElementById("fig").src = ""; .// 여기에 = 삽입하였습니다.

    2. 그리고 보내준 2.jpg를 보면 아래 라인 끝에 빨갛게 오류가 났다고 표시되어 있는데 이곳에 마우스를 올리며 오류 메시지를 보여 줍니다. 잘 관찰하면 문제를 해결할 수 있어요.
    <h3 onmouseover = "show()" onmouseout="hide()">

    오류 메시지는 "show() is not defined" 인데 show() 함수가 선언되어 있지 않다고 합니다.
    선언안된 함수를 부르니까 마우스 올리면 오류가 나서 이미지가 출력되지 않아요.
    분명이 show() 함수를 만들었는데 라고 생각들겠죠.
    그러니까 show() 함수의 선언부 가까운 다른 곳에 오류가 있으면 show() 함수까지 영향을 받아요

    또 오른쪽 상단에 크롬에서 x14라고 빨갛게 표시된 부분이 보이는데 이곳을 누르면 오류난 곳을 알려줍니다.
    이 기능을 활용하면 오류를 빨리 찾고 수정할 수 있습니다.

QnA

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

List of Articles
번호 제목 글쓴이 날짜 조회 수
공지 읽어주세요! 연습문제 및 실습문제 정답 공개에 관한 공지입니다. file 관리자 2017.06.20 18304
303 간단한 질문 드립니다. 1 뚜룹 2018.06.07 535
302 관리자님 안녕하세요 2018.06.12 228
301 오픈챌린지 6장 질문 littlelion 2018.06.20 435
300 오픈챌린지 9장 littlelion 2018.06.20 1002
299 실습문제 6장 5번 littlelion 2018.06.20 780
298 open challenge 6장 1 aoharu 2018.09.15 622
297 예제코드 크롬 브라우저실행 1 2018.09.17 94
296 혹시 예전 서적인 "DHTML + 자바스크립트 프로그래밍"의 예제를 받을 수 있는 방법은 없는지요? 2 비만타쿠미 2018.09.26 116
295 7장 6번문제 질문있습니다. 2 초심자 2018.09.26 340
294 4장 19번 1 .. 2018.09.28 906
293 5장 10번 실습문제 1 익명 2018.09.29 313
292 각 장의 연습문제에 쓰인 사진파일좀 올려주실수있나요? 1 익명 2018.09.29 159
291 크롬 오디오 자동재생 관련 질문입니다! 1 ^_^ 2018.09.30 449
290 4장 실습문제 7번, 9번 1 ehdtn6288 2018.10.01 428
289 실습문제 짝수번 이미지들은 다운할 수 없나요? 공부하면성공한다 2018.10.02 366
288 5장 실습문제 9번 1 file 123 2018.10.03 563
287 3장 151페이지 오픈첼린지3번 문제 답은 어디서 볼 수 있나요? 어려워요 2018.10.07 226
286 안녕하세요 질문드립니다! 2 Hola 2018.10.17 418
285 6장 그림 2번 질문있습니다! 2 1592012 2018.10.19 166
284 오픈 첼린지 9장 질문 있습니다. 4 file muuum 2018.10.21 633
목록
Board Pagination Prev 1 ... 2 3 4 5 6 7 8 9 10 ... 21 Next
/ 21
위로