랜덤으로 이미지 생성 (랜덤 팝업 모달)

var imgArray = new Array(); imgArray[0] = "이미지 소스"; imgArray[1] = "이미지 소스"; imgArray[2] = "이미지 소스" imgArray[3] = "이미지 소스"; function showImage(){ var imgNum = Math.round(Math.random()*3); var objImg = document.getElementById("introImg"); objImg.src = imgArray[imgNum]; }
// 팝업 모달 이미지와 스크롤 이동 타겟 var popUpImages = [{ src: 'https://static.shoeprize.com/kicks_2nd_anniversary/kicks_2nd_anniversary_pop_up.webp', target: '#targetSocks' }, { src: 'https://static.shoeprize.com/kicks_2nd_anniversary/kicks_2nd_anniversary_pop_up2.webp', target: '#targetTshrits' }, { src: 'https://static.shoeprize.com/kicks_2nd_anniversary/kicks_2nd_anniversary_pop_up3.webp', target: '#targethoddies' }]; // 팝업 모달 랜덤 생성 function showPopUpModal() { var imgNum = Math.round(Math.random() * 2) var objImg = $('.pop_up_area img') $('body').append(`<div class="pop_up_area"> <img src=${popUpImages[imgNum].src} alt="popup modal image"> <a href="#"> <div class="btn_scroll" data-target=${popUpImages[imgNum].target}></div> </a> <a href="#"> <div class="btn_cancel"></div> </a> </div>`) }
JP
이중표Frontend Engineer

3년차 프론트엔드 개발자. Next.js, React, TypeScript 기반 웹 애플리케이션 개발 전문. 대규모 트래픽 환경에서 SSR·ISR 렌더링 전략 설계 경험.

이력서 보기