JavaScript page Redirection with Countdown Timer

JavaScript page Redirection with Countdown Timer

Recently I spend My Time in Front-end Development Because I develop an Event web apps for Upcoming Festivals. In the Development period, I made a Lot of fancy Functions in the web app Like CSS animations, Ajax Counting’s, and JavaScript page Redirection with Countdown Timer.so today I am going to share a code for Link/page Redirection with Countdown Timer(Using Javascript).

I think you are well Known about Link page Redirection with Countdown Timer.

Most of the top Ad networks using this Method to display the Banner ads in Link/page Redirection.

Feature’s

• Link Redirection with Countdown time
• You can Display your Affiliate/banner ad’s in Countdown page.
• Easy to Modify.

Here is the Code for page Redirection with Countdown Timer

<!-- Count down redirect using CSS -->
 <style>
 awt-rd {
 padding: 0 8px;
 line-height: 1.5;
 font-size: 14px !important;
 padding: 5px 5px 3px;
 background-color: #f7f7f9;
 font-family: Consolas, Monaco, Lucida Console, monospace;
 color: #336cac;
 border: 1px solid #e1e1e8;
 }
 awt-rd { background-color: #f7f7f9;
 border: 1px solid #e1e1e8;
 color: #336cac;
 font-size: 17px;
 }
 awt-rd:before {
 color: #333;
 }
 </style>

<!-- Modify this according to your requirement -->
 <br><div style="text-align:center;"><h3><awt-rd>Redirecting to Product Page after <span id="countdown">6</span> seconds</awt-rd></h3></div><br><br>

<!--Count down redirect JavaScript -->
 <script type="text/javascript">

// Total seconds to wait
 var seconds = 6;

function countdown() {
 seconds = seconds - 1;
 if (seconds < 0) {
 // Chnage your redirection link here
 window.location = "YOUR REDIRECTION LINK";
 } else {
 // Update remaining seconds
 document.getElementById("countdown").innerHTML = seconds;
 // Count down using javascript
 window.setTimeout("countdown()", 1000);
 }
 }

// Run countdown function
 countdown();

</script>

You can Change the redirection page Style According to your Requirements

• Using Javascript Window setTimeout() Method – Refer
• HTML DOM innerHTML Property Function – Refer
• For page Redirection using JavaScript Window Location – Refer

That’s all Hope this script with help you to show the Link redirection with Countdown Timer.