시간 지나면 자동으로 페이지 이동

개발/실전 2015. 12. 2. 15:06

페이지가 변경되어, 안내 창이 나오고 시간 지나면 자동으로 페이지 이동을 하고 싶다.

두가지 방법이 있는데

가장 쉬운 방법은

 

<meta http-equiv="refresh" content="5; url=http://hoon2kc.tistory.com/" />

 

이 한줄만 넣어주면 된다. content 의 값으로 시간을 조절 할 수 있다.

 

두번째 방법은, 화면상에 00 초 후에 페이지를 이동합니다 라는 안내 문구를 띄우고 싶을때 하는 방법이다.

 

먼저 <span id="timeString"></span>   으로 안내 문구 위치를 잡아준다.

그 다음으로,

 

 <script type="text/javascript">
 <!--
 var MOVE = function(param){
    var self=this;
    this.object = document.getElementById(param.id);
    this.time = param.time||60;      //페이지 이동 시간을 정해 준다. 여기선 1분
    this.url = param.url||'';
    this.timer = null;
    this.run = function(){
     timeString.innerHTML = this.time + '초 후 자동으로 이동 합니다.';
     this.time--;
     if(this.time < 0){
     if(this.url!=''){
     location.href = this.url;
     window.clearTimeout(this.timer);
     }
     }else{
     this.timer = window.setTimeout(
     function(){self.run();}
     ,1000
     )
     }
  };
  this.run();
  }
  window.onload = function(){
  new MOVE({id:'prt',url:'http://freetsim.freet.co.kr'}); //이동할 URL
  }
  //-->
  </script>

 

이상입니다.