by Hiroshi on November 1st, 2008
Auto Page Reloaded-Auto Refresh – Meta tag based – Button based -Live Refresh with countdown
<META HTTP-EQUIV="REFRESH" CONTENT="300">
Refresh Button
<script language="JavaScript"> document.write('<form><input type=button value="Refresh the browser with button" onClick="history.go()"></form>') </script>
Live Refresh with countdown
<script language="JavaScript"> //configure refresh interval (in seconds) var countDownInterval=60; //configure width of displayed text, in px (applicable only in NS4) var c_reloadwidth=200 </script> <ilayer id="c_reload" width=&{c_reloadwidth}; ><layer id="c_reload2" width=&{c_reloadwidth}; left=0 top=0></layer></ilayer> <script> var countDownTime=countDownInterval+1; function countDown(){ countDownTime--; if (countDownTime <=0){ countDownTime=countDownInterval; clearTimeout(counter) window.location.reload() return } if (document.all) //if IE 4+ document.all.countDownText.innerText = countDownTime+" "; else if (document.getElementById) //else if NS6+ document.getElementById("countDownText").innerHTML=countDownTime+" " else if (document.layers){ //CHANGE TEXT BELOW TO YOUR OWN document.c_reload.document.c_reload2.document.write('Next <a href="javascript:window.location.reload()">refresh</a> in <b id="countDownText">'+countDownTime+' </b> seconds') document.c_reload.document.c_reload2.document.close() } counter=setTimeout("countDown()", 1000); } function startit(){ if (document.all||document.getElementById) //CHANGE TEXT BELOW TO YOUR OWN document.write('Next <a href="javascript:window.location.reload()">refresh</a> in <b id="countDownText">'+countDownTime+' </b> seconds') countDown() } if (document.all||document.getElementById) startit() else window.onload=startit </script>
Related Posts
- Javascript Essentials Part 6
- Javascript Essentials Part 5
- Javascript Essentials Part 4
- Javascript Essentials Part 3
- Javascript Essentials Part 1
- Use Any Font in Webpages As Text
- Advanced JS Calendar
- Create Simple Javascript Based Calendar
- Change Image Opacity Easily Using CSS or JS
- Create jQuery Smooth News Rotator
Author
Hiroshi (published 95 Posts on Web Style Press, Best Practices from all the Web, Build Better Websites)
