Timed Redirection

I was trying to create a timed redirection for a website. The requirement was after users register site successfully, display the success page and redirect to welcome page after 5 seconds. Also, we wanted to display countdown time on the screen.

There are many ways to redirect a page. You can use HTML meta tag to refresh a page like this:

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

However, it is discouraged and deprecated by the W3C, since unexpected refresh can disorient users. Meta refresh also impairs the web browser's "back" button in some browsers (including Internet Explorer 6 and before), although most modern browsers compensate for this (Mozilla Firefox, Opera, Internet Explorer 7). -- from Wikipedia (Meta_refresh)

Also, since I need to display the countdown time, I decided to use Javascript. Some people on the Internet suggest using HTML input tags to display the countdown time. Personally, I don't like add a tag just for displaying something dynamic on the screen. Therefore, I use JavaScript setInterval method to handle it.

Here is the JavaScript code:

function timedRedirect(time, page){
  var timeTag = dojo.byId('redirectTime');
  if(timeTag){
    setInterval(function(){
      time--;
      timeTag.innerHTML = time;
      if(time == 0){
        window.location = page;
      } 
    }, 1000);
    timeTag.innerHTML = time;
   }
}

In your HTML file:

  
You will be redirected to the Welcome page inseconds or click here to go there now.
  

Also, I have a css style like this:

.redirectTime{
 margin-left: 5px;
 margin-right: 5px;
 color: #cc0000;
}

a.redirectLink, a.redirectLink:link, a.redirectLink:visited, a.redirectLink:active{
 color: #cc0000;
}

a.redirectLink:hover{
 color: #cc0000;
 text-decoration: underline;
}