이 글은 Tistory를 기준으로 작성 되었습니다.
제 블로그에 들어 올때 이 화면 보셨나요?
로딩중 화면
바로 로딩 화면입니다.
블로그가 로딩중일때 이런식으로 로딩중임을 알리는 화면이 나오도록 하는 방법을 알아보겠습니다.
스킨 선택 화면
스킨 선택 화면에서 편집하기를 클릭 합니다.
스킨 선택 화면에서 편집하기를 누르면 나오는 두개의 박스 중에서 위에 박스를 눈을 크게 뜨고 살펴 보면 <body> 라는 것을 찾을 수 있습니다. 찾기 어렵다면 ctrl+f 를 눌러 찾기 버튼을 이용해서 찾으세요.
찾으셨으면 <body> 바로 아래 줄에다가
<div id="loadingBar" style="position:absolute; top:40%; left:45%;">
<img src="로딩중 이미지 경로" /></div>
<div id="divBody" style="display:none">
이렇게 입력합니다.
로딩중 소스 1.txt필자의 블로그에 우클릭, 드래그 금지가 되어 있는 관계로 위의 소스를 메모장에 적어 올려 놨습니다.
다운 받아 메모장에 적혀 있는 소스를 복사해서 사용하세요.
그 다음에 skin.html 창을 죽 내려서 맨 밑으로 갑니다. 맨 밑으로 가면 </body> 를 볼 수 있습니다. 찾기 어렵다면 이것도 ctrl+f 를 눌러 찾기 버튼을 이용해서 찾으세요
찾으셨으면 이번에는 </body> 바로 위에다가
</div><script type="text/javascript" language="JavaScript">
<!--document.getElementById('loadingBar').style.display="none";
document.getElementById('divBody').style.display="";//-->
</script>
이렇게 입력해 줍니다.
이것역시 메모장 파일로 올려 놨습니다.
그 다음에 아래에 있는 저장하기 버튼을 눌러 주세요.
여기까지 잘 하셨으면 블로그가 로딩중일 때 로딩중 이미지가 나오는 화면을 보실수 있습니다.
로딩중 이미지 위치 조절은 <body> 아래에 적는
<div id="loadingBar" style="position:absolute; top:40%; left:45%;"> 에서 top:40%; left:45% 이부분의
숫자를 조절 하시면 됩니다.
Trackbas address :: http://ourworld.tistory.com/trackback/3
-
Tracked from 日常茶飯事
at 2007/04/28 22:48
삭제
Subject: 티스토리에서 PreLoading사용하기
태터툴즈에 Preloading이라는 플러그인이 있다. 페이지가 전체가 로딩되기 전까지는 애니gif를 보여주고 로딩이 끝나면 한 번에 페이지를 보여주는 기능이다. 물론 티스토리에는 없다. 하지만 사용할 수는 있다. 방법은 skin.html을 수정하는 것. 블라블라 어쩌구 저쩌구 <s_t3>와 </s_t3>앞 뒤로 저 스크립트와 div태그를 넣어주면 OK. 그리고 플러그인에 들어있는 로딩용 애니gif도 함께 스킨과 함께 올리면 된다. 물론 이미지 종류는.....
유용하게 사용했습니다. 감사합니다.^^
잘 사용 하세요 ^^
굿입니다~ ^^ㅋ
감사 합니다 ^^
감사합니다 많은 도움 되었습니다 ^^
블럭 시작한지 얼마 되지 않았는데 많은 도움을 받았습니다..감사 합니다