www.webdeveloper.com
Results 1 to 4 of 4

Thread: looking for help with auto refresh image script

  1. #1
    Join Date
    Nov 2007
    Posts
    53

    looking for help with auto refresh image script

    hi all,

    first i guess it best i explain what i am trying to do and then what i have done so u can hopefully point out my mistakes..

    atm i have a webserver setup at home ( local only) and an internal ftp program running on the webserver... i have an ip camera ( mobotix) ftping images every 1 second to the webserver and puting the jpg image in a folder called testpic...

    what i am trying to do is get a script working so that it auto refreshes the image every second ....

    so what i have done.. well i have this script:

    Code:
    <!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>
    <meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
    <title>Untitled Document</title>
    <script language="JavaScript"><!--
    function refre****() {
       if (!document.images) return;
       document.images['myCam'].src = 'testpic/image1.jpg' + Math.random();
       setTimeout('refre****()',1000); // refresh every 1 secs
    }
    //--></script>
    </head>
    
    <body onLoad=" setTimeout('refre****()',1000)">
    <div align="center">
      <table width="640" border="0" cellpadding="0" cellspacing="0">
        <!--DWLayoutTable-->
        <tr>
          <td width="640" height="480" valign="top"><img src="testpic/image1.jpg" name="myCam" width="640" height="480" />&nbsp;</td>
        </tr>
      </table>
    </div>
    </body>
    </html>
    the code seems to be ** out the refresh it part of the code, so where it says refr**** it is refresh it with out a space...


    this basic site puts a copy of the image1.jpg in the middle of the screen and then refresh it every second. but for some reason it displays the first one then when it refreshes the image there is no picture just the box with a cross.. now i know that the image has updated in the testpic file cus i can F5 the page to display the new image that the script should have loaded.

    can anyone be a massive help and point out where i could be going wrong?

    thanks for any help at all

    Vade

  2. #2
    Join Date
    Nov 2007
    Posts
    53
    Anyone got an idea on this?

    thanks

  3. #3
    Join Date
    Jul 2005
    Location
    Tangerang, Indonesia
    Posts
    171
    when you got no picture and just the box with a cross, look at your code:
    Code:
    document.images['myCam'].src = 'testpic/image1.jpg' + Math.random();
    it wouldn't display anything, unless you erase "+ Math.random()".

    I never success to refresh the image with same name with javascript (although it actually different in content), because the browser cache (i guess), i need to refresh the browser to see the changes. the best practice is using iframe, inside the iframe there is html page displaying your image and refersh every second.
    Code:
    <iframe src="imgCam.html" width="300" height="300"></iframe>
    and the imgCam.html
    Code:
    <html>
      <head>
        <meta http-equiv="cache-control" content="no-cache" />
        <meta http-equiv="pragma" content="no-cache" />
        <meta http-equiv="expires" content="-1000" />
        <meta http-equiv="refresh" content="1"/>
      </head>
      <body style="margin:0px;">
      <img src="image1.jpg" width="250" height="250"/>
      </body>
    </html>
    if you or anyone find the solution with javascript, please let me know
    Yerie Piscesa

  4. #4
    Join Date
    Sep 2011
    Posts
    1

    yep, the iframe works

    thank you for this solution my friend.

Thread Information

Users Browsing this Thread

There are currently 1 users browsing this thread. (0 members and 1 guests)

Posting Permissions

  • You may not post new threads
  • You may not post replies
  • You may not post attachments
  • You may not edit your posts
  •  
HTML5 Development Center



Recent Articles