본문 바로가기
웹프로그램

javascript에서 미리 이미지 로드하기

by 세이박스 2014. 5. 23.
반응형
롤오브 메뉴 이미지 또는 이미지 슬라이드의 경우 이미지가 자주 바뀌어야 하는데 이때 매번 서버에서 이미지를 가져오게 하면 트래픽이 많이 발생한다. 또한 모바일의 경우 이동중 인터넷 상태가 않좋으면 이미지 액박이 생기기도 하는데 이때 이미지를 미리 사용자PC에 로드한 다음 불러오는 방법을 이용시 인터넷이 끊어 져도 이미지는 계속 보이게 된다.
 

<script language="javascript">
function init()
{
 img1 = new Image;
 img1.src = "images/img1.jpg";
 img2 = new Image;
 img2.src = "images/img2.jpg";

 document.getElementById("num1").src = img1.src;
 document.getElementById("num2").src = img2.src;
}
</script>

<body onload="javascript:init();">
<img id="num1"><br>
<img id="num2"><br>
<body>
 

 

반응형