What do I have to do to have a function on a website where it says it will redirect you to the site in 3 seconds or so?
-
2possible duplicate of How can i redirect to a page (home) via another page(success page) where some success message is to be displayed?– kennytmJul 20, 2010 at 16:15
-
I'm just curious, why would you ever want to do that? Everytime I visited such page, I'd rather have been directed in 0 seconds.– allesklarJul 21, 2010 at 11:01
-
@allesklar sorry for the late reply. I'm in development of a site, and I wanted to see if there was an easier to switch from code editor to web browser without hitting refresh everytime.– codedudeAug 16, 2010 at 21:59
-
This JS redirect generator will help you to easily create delayed redirect snippets. It has a noscript and seo support, plus has an IE 8 - and lower - fix to pass the http referer!– Patartics MilánSep 3, 2015 at 15:27
-
1@allesklar one example to use this. If you change your domain and want everyone to be redirected to the new domain in the first month (but letting them know the old domain will be removed after a month or so). Because even if you send and email there's always someonte who forget and go to the old domain.– patriciaFeb 1, 2016 at 15:39
7 Answers
<meta http-equiv="refresh" content="3;url=http://www.google.com/" />
-
Or just redirect to the root if you have multiple sites using <meta http-equiv="refresh" content="3;url=/" />– DJSampatMay 16, 2019 at 5:15
-
8The W3C recommends this tag not be used:w3.org/TR/WCAG10-HTML-TECHS/#meta-element Nov 13, 2019 at 22:14
You're probably looking for the meta
refresh
tag:
<html>
<head>
<meta http-equiv="refresh" content="3;url=http://www.somewhere.com/" />
</head>
<body>
<h1>Redirecting in 3 seconds...</h1>
</body>
</html>
Note that use of meta
refresh
is deprecated and frowned upon these days, but sometimes it's the only viable option (for example, if you're unable to do server-side generation of HTTP redirect headers and/or you need to support non-JavaScript clients etc).
If you want greater control you can use javascript rather than use the meta tag. This would allow you to have a visual of some kind, e.g. a countdown.
Here is a very basic approach using setTimeout()
<html>
<body>
<p>You will be redirected in 3 seconds</p>
<script>
var timer = setTimeout(function() {
window.location='http://example.com'
}, 3000);
</script>
</body>
</html>
-
1This would be the way to go if you want the text to dynamically count down to 0 prior to the redirect. Use a 1 second timer, where the timer function updates the HTML text and then start a new 1 second timer, until 3 seconds have elapsed, then do the redirect. Jul 20, 2010 at 19:41
Here's a complete (yet simple) example of redirecting after X seconds, while updating a counter div:
<html>
<body>
<div id="counter">5</div>
<script>
setInterval(function() {
var div = document.querySelector("#counter");
var count = div.textContent * 1 - 1;
div.textContent = count;
if (count <= 0) {
window.location.replace("https://example.com");
}
}, 1000);
</script>
</body>
</html>
The initial content of the counter
div is the number of seconds to wait.
-
This didn't work until I replaced
location.href="https://example.com";
withwindow.location='https://example.com'
– NateH06Jul 29, 2017 at 15:12 -
1Might be better to use
window.location.replace("http://example.com");
for the reasons discussed here: stackoverflow.com/a/506004 The change would provide this answer more generality.– PsycheMay 9, 2018 at 20:39 -
If the redirect target is slow to respond (more than 1 sec) then
window.location.replace()
is called multiple time and the X secondcount
can go negative. I modified two lines :div.textContent = ((count < 0) ? 0 : count);
andif (count == 0) {
.– ForguesRNov 19, 2021 at 19:46
The simplest way is using HTML META tag like this:
<meta http-equiv="refresh" content="3;url=http://example.com/" />
Place the following HTML redirect code between the and tags of your HTML code.
<meta HTTP-EQUIV="REFRESH" content="3; url=http://www.yourdomain.com/index.html">
The above HTML redirect code will redirect your visitors to another web page instantly. The content="3; may be changed to the number of seconds you want the browser to wait before redirecting. 4, 5, 8, 10 or 15 seconds, etc.
Use this simple javascript code to redirect page to another page using specific interval of time...
Please add this code into your web site page, which is you want to redirect :
<script type="text/javascript">
(function(){
setTimeout(function(){
window.location="http://brightwaay.com/";
},3000); /* 1000 = 1 second*/
})();
</script>
-
<meta http-equiv="refresh" content="3;url=http://example.com/" />
is a better option as it is simpler and works without JavaScript support.– EdwardApr 6, 2016 at 18:48 -
you are right bro... but its depends upon situation.. sometime we need to redirect on specific event for that JS is the best option. Apr 7, 2016 at 7:06
-
I get what you mean, "Sunny S.M". Although meta tags should be used almost always, there could be specific scenarios like yours where JavaScript would be the only option.– EdwardApr 7, 2016 at 10:42