Links

Image Background

Image Background

배경화면 랜덤으로 불러오기
const body = document.querySelector("body"); // 바디지정
const IMG_NIMBER = 5; // 이미지 갯수
function handleImgLoad(){
console.log("finished loading");
}
function paintImage(imgNumber){
const image = new Image(); // 이미지값을 받음
image.src=`img/bg${imgNumber + 1 }.jpg`; // +1 을해주는이유는 0부터 시작하기때문에 이미지 1부터 시작하기 위해서이다.
image.classList.add("bgImage") // image에 bgImage 클레스명 추가
body.prepend(image); //prepend 맨앞으로 추가됨
image.addEventListener("loadend", handleImgLoad());
}
function genRandom(){
const number = Math.floor(Math.random() * IMG_NIMBER); // 이미지명을 랜덤하게 불러옴
return number;
}
function init(){
const randomNumber = genRandom();
paintImage(randomNumber) // 함수 paintImage 랜덤하게 이미지를 업로드해줌
}
init();

Math.random()

랜덤한 숫자를 불러온다.

Math.floor()

3 이하의 소수점을 떨어트림

Math.ceil()

반대로 올려주는 역활을 한다.