Member Avatar for puk

Hi,

I want to do a redirect count so that the user can see the count going down. for example, I want them to be able to see the following.

You will be redirected in 5 seconds.

The user should be able to see the count going down from 5 to 4 to 3 to 2 to 1 and then they are redirected.

I can get the page to redirect after 5 seconds but I want the user to be able to see it count down.

Thanks in advance for your help

Edited by puk because: To give more clarity
  • 2 Contributors
  • 1 Reply
  • 82 Views
  • 15 Hours Discussion Span
  • Latest Post Latest Post by Taywin
Member Avatar for Taywin

The code below just to show you how to do it (approximate time). I do not want to complicate the code, so it should be working in most cases.

<html>
<head>
<script type="text/javascript">
function redirectTo(url, timerID) {
  var el=document.getElementById(timerID)
  if (el) {  // element exist
    el.innerHTML = 5  // start with 5 seconds
    window.setTimeout("runTimer('"+url+"','"+timerID+"')",1000)
  }
}

function runTimer(url, timerID) {
  var el=document.getElementById(timerID)
  if (el) {
    var time = parseInt(el.innerHTML,10) - 1
    if (time>0) {  // not 0 yet, keep running
      el.innerHTML = time
      window.setTimeout("runTimer('"+url+"','"+timerID+"')",1000)
    }
    else {  // redirect
      window.location = url
    }
  }
}
</script>
</head>

<body>
  <input type="button" value="Redirect" onclick="redirectTo('a_URL_to_be_redirected_to', 'showTimer')">
  <br />
  <div id="showTimer"></div>
</body>
</html>
Edited by Taywin because: n/a
Be a part of the DaniWeb community

We're a friendly, industry-focused community of developers, IT pros, digital marketers, and technology enthusiasts meeting, networking, learning, and sharing knowledge.