[js] 이미지 미리 로딩하기

hooni

조회 수 7008 댓글 0

Prev이전 문서

Next다음 문서

Prev이전 문서

Next다음 문서

자바스크립트를 이용하여 애니메이션 효과 또는 롤오버(rollover) 효과를 구현할 때 필수적으로 이미지 미리 읽어들이기 기법을 사용한다. 이 때 사용할 수 있는 유용한 함수를 하나 소개하면 다음과 같다:

<!--

function preload() {

if (!document.images) return;

var ar = new Array();

var arguments = preload.arguments;

for (var i = 0; i < arguments.length; i++) {

ar[i] = new Image();

ar[i].src = arguments[i];

}

// -->

</SCRIPT>

이 함수를 BODY 태그의 onLoad 이벤트에서 다음과 같이 호출해 주면 된다. 이미지가 많으면 preload의 파라미터에 더 넣어주면 된다:

Facebook Twitter Google Pinterest KakaoStory Band

✔댓글 쓰기

댓글 쓰기

에디터 사용하기 닫기

List of Articles
번호	분류	제목	글쓴이	날짜	조회 수
789	Etc	[svn] 콘솔에서 svn 사용시 레티나용 이미지 add 안될 때..	hooni	2013.09.25	37501
788	System/OS	[mac] SVN 1.8 업데이트 방법	hooni	2013.09.24	14571
787	Develop	[ios] 간단한 방법으로 OS버전 확인하기.	hooni	2013.09.24	13316
786	Etc	영어. 외우면 도움되는 필수영어회화 표현	hooni	2013.09.09	20954
785	Develop	[ios] Hybrid 앱 스터디 발표 자료	hooni	2013.09.06	13715
784	Develop	[python] 애니팡, 캔디팡 매크로	hooni	2013.09.06	17329
783	Develop	[ios] None IB vs. StoryBoard 샘플 소스	hooni	2013.09.06	16935
782	Develop	[ios] 앱에서 다른 앱 실행시키기	hooni	2013.09.05	18539
781	Etc	[link] 유용한 사이트 링크.	hooni	2013.08.19	71464
780	Etc	베지어 곡선 (Bezier curve)	hooni	2013.08.18	221335
779	Etc	[web] 제로보드 XE 템플릿에서 if문에 대해서 알아봅시다	hooni	2013.08.16	19814
778	Develop	아이 훌레시 작업중 ㅋㅋ	hooni	2013.08.09	0

쓰기

Contents