250x250
Notice
Recent Posts
Recent Comments
Link
반응형
| 일 | 월 | 화 | 수 | 목 | 금 | 토 |
|---|---|---|---|---|---|---|
| 1 | ||||||
| 2 | 3 | 4 | 5 | 6 | 7 | 8 |
| 9 | 10 | 11 | 12 | 13 | 14 | 15 |
| 16 | 17 | 18 | 19 | 20 | 21 | 22 |
| 23 | 24 | 25 | 26 | 27 | 28 | 29 |
| 30 |
Tags
- CSS
- List
- priority_queue
- union_find
- 큐
- javascript
- Union-find
- JPA
- alter
- math
- date
- map
- Calendar
- NIO
- 스택
- 스프링부트
- set
- Properties
- html
- scanner
- dfs
- Java
- spring boot
- 리소스모니터링
- BFS
- GC로그수집
- sql
- string
- deque
- 힙덤프
Archives
- Today
- Total
매일 조금씩
[Django][Python] 로딩페이지 작성하기 - SetTimeout() 본문
728x90
반응형
웹 또는 앱을 처음 실행 시켰을 때 나오는 로딩 페이지를 다음페이지로 넘어가는것을 특정시간 delay시켜 원하는 로딩 페이지를 띄우도록 구현했다.

위와 같이 chachacha폴더의 chachacha-master라는 프로젝트는
bars, maps,users의 총 3개의 앱을 가진다.
그중 users 앱의 templates 폴더에 loading.html을 만든다.


앱을 열었을 때 3초 정도 delay를 주기 위해
setTimeout()을 사용한다.
{% load staticfiles %}
<html lang="en">
<head>
<meta charset="UTF-8">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<meta http-equiv="X-UA-Compatible" content="ie=edge">
<script src="http://ajax.googleapis.com/ajax/libs/jquery/1.7.1/jquery.min.js" type="text/javascript"></script>
<title>Document</title>
</head>
<body>
<div id="loading">
<img src="{% static 'opening.gif' %}" alt="" >
</div>
</body>
<style>
#loading{
padding-top: 40;
margin-left: 10;
}
img{
position: absolute;
height: 85%;
text-align:center;
}
</style>
<script>
$(document).ready(function(){
setTimeout(function(){
if (window.location == 'http://127.0.0.1:8000/users/loading' ) {
window.location.href='http://127.0.0.1:8000/users';}}, 30000)
})
</script>
</html>
if (window.location == 'http://127.0.0.1:8000/users/loading' ) {
window.location.href='http://127.0.0.1:8000/users';}}, 30000)
이 조건문으로 인해 30초 뒤에
'http://127.0.0.1:8000/users/loading'(로딩 페이지) 에서
'http://127.0.0.1:8000/users'(원래 들어가려던 페이지)로 이동 된다.
728x90
반응형