refresh item on page(iframe, table, or div)

I would like to refresh an iframe on my website at a given interval. I have some code below. It is not working when I use the url in the src.  However, if I replace the iframe src with an image file vs a url, it works fine. Any one  know why?

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml" >
<head>
    <title>Untitled Page</title>
    <SCRIPT LANGUAGE="JavaScript">
<!--

var secs
var timerID = null
var timerRunning = false
var delay = 1000

function InitializeTimer()
{
    // Set the length of the timer, in seconds
    secs = 25
    StopTheClock()
    StartTheTimer()
}

function StopTheClock()
{
    if(timerRunning)
        clearTimeout(timerID)
    timerRunning = false
}

function StartTheTimer()
{
    if (secs==0)
    {
        StopTheClock()
        self.status = ""
        // Here's where you put something useful that's
        // supposed to happen after the alotted time.
        // For example, you could display a message:
       
        refresh();
        InitializeTimer();
    }
    else
    {
        self.status = secs
        secs = secs - 1
        timerRunning = true
        timerID = self.setTimeout("StartTheTimer()", delay)
    }
}

//-->
</SCRIPT>
</head>
<body onload="InitializeTimer()">
<table BORDER=0 CELLSPACING=0 CELLPADDING=0 bordercolor="#111111" >
<tr><td WIDTH="100%">
<iframe id="ifx" width="365" scrolling="No" height="340" frameborder="no" src="http://pub.camera.trafficland.com/trafficimage.php?system=ladotd&webid=2039&pubtoken=7294826e9eb4e70cbd3c86630f4186b7&0.44067952619013856"></iframe>
</td>
</tr>
</table>

<form>
  <p><input type="button" onclick="refresh()" value="Refresh Form Button"
  name="button1"></p>
</form>


<script language="JavaScript">
function refresh()
{
      document.ifx.location.reload();
}
</script>
</body>
</html>
LVL 6
LeeHenryAsked:
Who is Participating?

Improve company productivity with a Business Account.Sign Up

x
 
ZvonkoConnect With a Mentor Systems architectCommented:
Here my version:

<html xmlns="http://www.w3.org/1999/xhtml" >
<head>
    <title>Zvonko &#42;</title>
    <SCRIPT LANGUAGE="JavaScript">
<!--

var secs
var timerID = null
var timerRunning = false
var delay = 1000
var camera = "http://pub.camera.trafficland.com/trafficimage.php?system=ladotd&webid=2039&pubtoken=7294826e9eb4e70cbd3c86630f4186b7&0.44067952619013856";
function InitializeTimer()
{
    // Set the length of the timer, in seconds
    secs = 25
    StopTheClock()
    StartTheTimer()
}

function StopTheClock()
{
    if(timerRunning)
        clearTimeout(timerID)
    timerRunning = false
}

function StartTheTimer()
{
    if (secs==0)
    {
        StopTheClock()
        self.status = ""
        // Here's where you put something useful that's
        // supposed to happen after the alotted time.
        // For example, you could display a message:
       
        refresh();
        InitializeTimer();
    }
    else
    {
        self.status = secs
        secs = secs - 1
        timerRunning = true
        timerID = self.setTimeout("StartTheTimer()", delay)
    }
}

//-->
</SCRIPT>
</head>
<body onload="InitializeTimer()">
<table BORDER=0 CELLSPACING=0 CELLPADDING=0 bordercolor="#111111" >
<tr><td WIDTH="100%">
<iframe name="ifx" id="ifx" width="365" scrolling="No" height="340" frameborder="no" ></iframe>
</td>
</tr>
</table>

<form>
  <p><input type="button" onclick="refresh()" value="Refresh Form Button"
  name="button1"></p>
</form>


<script language="JavaScript">
function refresh(){
  window.frames.ifx.location=camera+"&time="+(new Date()).getTime();
}

refresh();
</script>
</body>
</html>


0
Question has a verified solution.

Are you are experiencing a similar issue? Get a personalized answer when you ask a related question.

Have a better answer? Share it in a comment.

All Courses

From novice to tech pro — start learning today.