김미썸코딩

[Django][Python] 로딩페이지 작성하기 - SetTimeout() 본문

프로젝트/[likelion]술집 루트추천 - 차차차

[Django][Python] 로딩페이지 작성하기 - SetTimeout()

김미썸 2019. 9. 3. 22:53
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
Comments