카테고리

질문 & 답변
해결 여부

미해결

가위바위보 질문있습니다

20.06.18 00:51 작성 조회수 204

가위바위보.html
<!DOCTYPE html>
<html lang="en">

<head>
<meta charset="utf-8">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<title>Document</title>
<style>
#computer {
width: 160px;
height: 200px;
background: url('https://imagescdn.gettyimagesbank.com/500/17/859/219/0/824700804.jpg') -30px -80px;
}
</style>
</head>

<body>
<div id="computer"></div>
<div>
<button id="scissor" class="btn">가위</button>
<button id="rock" class="btn">바위</button>
<button id="paper" class="btn">보</button>
</div>
<script src="가위바위보.js"></script>
</body>

</html>
------------------가위바위보.js
var left = 0;
setInterval(function () {
if (left === 0) {
left = '-175px';
} else if (left === '-175px') {
left = '-300x';
} else {
left = 0;
}
document.querySelector('#computer').style.background =
'url(https://imagescdn.gettyimagesbank.com/500/17/859/219/0/824700804.jpg) -30px -80px' + left + '0';
}, 100);
------------------질문
이미지 변경이 안되는데 어떤게 문제인지 모르겠습니다.