Automatically Refresh a Page Using JavaScript or Meta Tags

By  on  

I try to steer clear of modifying a page without the user triggering the change, much less automatically refresh or redirect a page. There are times when automatically refreshing the page is important, like when you pull up game play-by-play pages on NFL.com or ESPN.com. Whatever your reason for automatically refreshing the page, keep one thing in mind: auto-refresh only pages that have little interaction -- nothing more than a click.

The JavaScript Method

var timer = null;
function auto_reload()
{
	window.location = 'http://domain.com/page.php';
}
	
	 <body onload="timer = setTimeout('auto_reload()',10000);">

The META Tag Method

The following refreshes the page every 30 seconds.

<head>
<meta http-equiv="refresh" content="30" />
</head>

Recent Features

  • By
    Camera and Video Control with HTML5

    Client-side APIs on mobile and desktop devices are quickly providing the same APIs.  Of course our mobile devices got access to some of these APIs first, but those APIs are slowly making their way to the desktop.  One of those APIs is the getUserMedia API...

  • By
    Creating Scrolling Parallax Effects with CSS

    Introduction For quite a long time now websites with the so called "parallax" effect have been really popular. In case you have not heard of this effect, it basically includes different layers of images that are moving in different directions or with different speed. This leads to a...

Incredible Demos

  • By
    Smooth Scrolling with MooTools Fx.SmoothScroll

    I get quite a few support requests for my previous MooTools SmoothScroll article and the issue usually boils down to the fact that SmoothScroll has become Fx.SmoothScroll. Here's a simple usage of Fx.SmoothScroll. The HTML The only HTML requirement for Fx.SmoothScroll is that all named...

  • By
    MooTools Equal Heights Plugin:  Equalizer

    Keeping equal heights between elements within the same container can be hugely important for the sake of a pretty page. Unfortunately sometimes keeping columns the same height can't be done with CSS -- you need a little help from your JavaScript friends. Well...now you're...

Discussion

  1. Ed Burrow

    I use a refresh feature in Firefox 3.0 (it’s an add-in) that allows me to set a refresh time for a page from 30 secs to unlimited minutes. I was wondering if you know of a program or add-in for IE7 (and now IE8) that would allow me to do same kind of thing.

    Thanks

    WldHogn

  2. vishal

    hi i am trying to reset counter after time interval and restart automatically. your code runs properly but it will post back if i want to avoid postback then what to do…
    thanku

  3. Mounica

    hi…..

    In my project the cascading style sheet is not working properly. So i thought of onload page refresh . So, can u please help me out with some code or any other stuff that gonna work properly please……….

    thank you…

  4. wwwwwwwwwwwwwwwwwwwwwwwwwwwwwwwwwwwwwwwwwwwwwwwwwwwwwwwwwwwwwwwwwwwwwwwwwwwwwwwwwwww

  5. Wow. Simple and works fine.

    Thanks a lot

  6. Nice and gud ……… ur code is working ……
    thanksssssss

  7. Could this script to change alexa rank ?

  8. Sachin

    How to reload page only one time on timer using jquery

  9. Eruanion

    Would this work to have the browser return to the home page? I need something that will time out and reset the broser back to homepage after a search or other actions on the system

Wrap your code in <pre class="{language}"></pre> tags, link to a GitHub gist, JSFiddle fiddle, or CodePen pen to embed!