본문 바로가기

work

[css/js] 로딩화면 만들기

로딩화면을 만드는 방법 간단하게.. 

#1 먼저 css 로 로딩중에 보여줄 화면을 만듭니다. 
보통 화면을 덮어서, 만듭니다. 

.loading{
	width:100%;
	height:100%;
	position:fixed;
	left:0px;
	top:0px;
	background:#fff;
	z-index:1000; /* 이 값으로 레이어의 위치를 조정합니다. */
}



#2 로딩으로 보여줄 div 를 화면에 넣습니다. 
보통 body 바로 담에 넣으면 됩니다.


#3 페이지가 로드되었을 때 로딩화면을 감춥니다.





이렇게하면, 일단 페이지가 로드되면 하얀 loading div 가 보이고, 
페이지가 로드되면, 그 div 가 사라집니다.