[javascript] 마우스 이동에따라 img 변경하기

 

이미지를 넣어야해서 코드가 괴랄해 원레 스크립트 첨부..

    let div = document.querySelector('div')

        let img = document.querySelector('div img')

        let pic = [];

        for(i=0; i < 5; i++){

            pic[i] = `images/img_lights${i}.jpg`

        }

            // 이미지를 배열 pic에 넣어준다.

            div.addEventListener('mousemove',function(a){

            // console.log(a.pageX) x와 y축값을 확인할 수 있다.

            let num = Math.round(a.pageX/175)

            // 175로 나누면 0.1~3.99 까지 나오기에 내림을해서 배열0~3을만든다.

            // let num = Math.floor(a.pageX/700*100)

            // 많은 사진을 이용할땐 백분율로 나눠서 하는게 좋다.

            img.src = pic[num]

        })