9.2.2 일정 시간마다 이미지 바꾸기
화면 구성을 확인했으니 이제 0.05초(50밀리초)마다 이미지를 바꿔 보겠습니다. 처음에는 가위였다가 바위로, 그다음에는 보로 이미지가 바뀝니다. 이미지의 x 좌표만 바꿔서 #computer 태그의 background로 넣으면 됩니다.
const rspX = {
scissors: '0', // 가위
rock: '-220px', // 바위
paper: '-440px', // 보
};
let computerChoice = 'scissors';
const changeComputerHand = () => {
if (computerChoice === 'rock') {
computerChoice = 'scissors';
} else if (computerChoice === 'scissors') {
computerChoice = 'paper';
} else if (computerChoice === 'paper') {
computerChoice = 'rock';
}
$computer.style.background = `url(${IMG_URL}) ${rspX[computerChoice]} 0`;
$computer.style.backgroundSize = 'auto 200px';
}