마우스를 올려도 사진이 안뜨는데 뭐가 잘못된걸까요우ㅜㅜㅠ
<!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: 10px; border: solid grey; background-color: grey;}
span { color: violet; font-size: 20px;}
</style>
<script>
function show() {
document.getElementById("fig").src ="test.png";
}
function hide() {
document.getElementById("fig").src = "";
}
</script>
</head>
<body>
<h3>Elcis 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 onmouseover="show()" onmouseout="hide()">Love Me Tender</span>.
He is often referred to as "<span>the King of Rock and Roll</span>".
</body>
</html>
코드에 혼란스러운 점이 있습니다.
1. 첨부한 파일을 열어보니 두 가지 잘못된 부분이 있습니다.
먼저 이미 파일은 이름이 test.png인데, 실습문제 1-4.html 파일에는 다음과 같이 파일 이름이 text.png로 잘못되었습니다.
또한 fig가 fih로 잘못 타이핑되어 있습니다.
document.getElementById("fih").src = "text.png"; ---> document.getElementById("fig").src = "test.png";
오타는 스스로 찾으세요.
3. 그런데 Q&A에 올라와 있는 html 파일의 소스에는 잘되어 있네요?
4. 그리고 공도리는 멋진 직업입니다. 세상을 바꾸니까요!!!