간지님의 프리로딩이미지
제가 쓰는 로딩바
1.8버젼에서는 무한 로딩이어서 제 홈페이지에 적용한 간지님의 프리로딩을
적용해봤습니다. 즉 프리로딩이란 페이지를 읽기를 완료하기전에 익스플로러내에
로딩 이미지를 나타내고 로딩이 완료시에 사라지는것을 말합니다.
형균님의 페이지로딩은 로딩완료시 로딩 이미지가 나타났다가 사라지는것입니다.
형균님의 페이지로딩 설치에 실패하시거나 이것이 마음에 드신다면 쓰셔도 됩니다
- 적용방법
1. <body> 바로밑에
<div align="center" id="loadingBar" style="position:absolute; left:350px; top:300px; z-index:1;">
<p align="center"> <img SRC="이미지경로" align="middle"><font face="Tahoma" color="#555555"> <span style="font-size:8pt;"><b>Loading..</b>.</span></font></p>
</div>
<div id="divBody" style="display:none">
을 붙혀 넣게 해줍니다. 형균님 1.8버젼의 페이지로딩에서도 문서 전체를
묶어주는것과 같습니다. 즉 <div id="divBody" style="display:none">
이부분이 바로 본내용을 묶어주는 소스입니다.
*참 고*
<p align="center">
<span style="font-size:8pt;"><b>Loading..</b>.</span></font></p>
이부분은 제 로딩이미지에는 문자가 들어가지 않아서 임의로 넣어준겁니다.
삭제하셔도 무방합니다.
_________________________________________________________________
2. 이제 </body> 바로 위에 위에 소스를 삽입합니다.
</div>
<script type="text/javascript" language="JavaScript">
<!--
document.getElementById('loadingBar').style.display="none";
document.getElementById('divBody').style.display="";
//-->
</script>
위의 </div>는 위의 <div id="divBody" style="display:none">에서
시작된 본문 전체를 감싸주는 역활입니다.
간단한 로딩 이미지는 http://www.ajaxload.info/ 에서 만드실수있습니다.
------------------------------------------------------------------
본래 소스를 보실려면 http://ganji.80port.net/bbs/view.php?id=musicAlbum&no=504&ln=&ls=on&lc=on&lcc=&keyword=%C7%C1%B8%AE%B7%CE%B5%F9 를 참조하시면 됩니다.(간지님 홈페이지에 가입필요ㅡ.,ㅡ;)
초보주제에 팁란에 글을 올리느라 정신이 없습니다만..
부디 좋게 써주시기 바랍니다.
"web_tip" 카테고리의 다른 글
- 활용도 높은 Menu 소스 (투명, 필터, 그림넣기가능) (댓글 0개 / 트랙백 0개) 2006/12/04
- 썸네일 링크 (댓글 6개 / 트랙백 3개) 2006/11/11
- 사이드바,레이어, 테이블등등 - Show/Hide (댓글 0개 / 트랙백 0개) 2006/12/02
- 익스에서 할수있는 재미있는 놀이.. (댓글 0개 / 트랙백 0개) 2007/02/22
- [행복한 고니님의 팁] 제목을 이미지로~ (댓글 0개 / 트랙백 0개) 2007/08/30
Leave your greetings here.