• 0

Javascript Image refresh

Asked by .AlleymaN,

 Share

Question

Proficient

.AlleymaN

Posted
Posted (edited)

Hi,

Ive been trying to make this webpage which refreshes one single image from the server every 'x' seconds. I have no knowledge of javascript so I used google to find something to suit my needs. The script I obtained works fine apart from the fact that sometimes it displays a blank image. (This happens more on my mobile device (Windows mobile IE) than laptop, most probably due to bandwidth issues.

Is there a way in JS to only display the image once the browser knows that the image has been completely downloaded and if it has not been completely downloaded, keep the last image displayed. Any help will be appreciated. Thank you.

Edited by .AlleymaN
Link to comment
https://www.neowin.net/forum/topic/513381-javascript-image-refresh/
Share on other sites

10 answers to this question

Recommended Posts

  • 0
Veteran

JoeC

Posted
Posted

java script:

function reloadIt()
  {
  if (document.getElementById("it"))
	{
	document.getElementById("it").src = document.getElementById("it").src;
	setTimeout("reloadIt()", 5000);
	}
   else
	{
	setTimeout("reloadIt()", 5000);
	}
  }

window.onload = reloadIt();

Just change 5000 to the delay in milliseconds you want - 10000 would be 10 seconds delay.

HTML Image code:

<img src="something.jpg" id="it" alt="Image" />

And change the "something.jpg" to the source of the image.

  • 0
Proficient

.AlleymaN

Posted
  • Author
Posted (edited)

Tried the script above, didnt work. For some reason it didnt even refresh the image. Tried placing the script both within the < head > and < body > tags with no luck. Is there anything else I should try?

Edit: IE gives me error on the same line as the window.onload function with the error "Not implemented". Tried Opera too, no luck.

Edited by .AlleymaN
  • 0
Veteran

JoeC

Posted
Posted

Mmkay, ditch the last line of the Javascript, and amend the image code to

&lt;img src="something.jpg" id="it" alt="Image" onload="reloadIt();" /&gt;

Should work I think :s

BTW, for JS debugging, FF is by FAR the most useful. I use Opera as my browser of choice, but FF is much better for JS debugging IMO.

  • 0
Grand Master

Kudos Veteran

Posted
  • Veteran
Posted 

&lt;!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd"&gt;
&lt;html xmlns="http://www.w3.org/1999/xhtml"&gt;
&lt;head&gt;
&lt;script type="text/javascript"&gt;
refreshImage = function()
{
img = document.getElementById("cam");
img.src="https://ephratareview.com/cam/mainstate.jpg?rand=" + Math.random();
}
&lt;/script&gt;
&lt;meta http-equiv="Content-Type" content="text/html; charset=iso-8859-1" /&gt;
&lt;title&gt;Auto-Refresh&lt;/title&gt;
&lt;/head&gt;
&lt;body onload="window.setInterval(refreshImage, 1*1000);"&gt;
&lt;img src="https://ephratareview.com/cam/mainstate.jpg" id="cam" /&gt;
&lt;/body&gt;
&lt;/html&gt;

I just copy and pasted this from an answer I gave in an other thread. Hasn't been tested in IE7, but should be fine.

  • 0
Mentor

Lilrich

Posted
Posted 

&lt;!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd"&gt;
&lt;html xmlns="http://www.w3.org/1999/xhtml"&gt;
&lt;head&gt;
&lt;script type="text/javascript"&gt;
refreshImage = function()
{
img = document.getElementById("cam");
img.src="https://ephratareview.com/cam/mainstate.jpg?rand=" + Math.random();
}
&lt;/script&gt;
&lt;meta http-equiv="Content-Type" content="text/html; charset=iso-8859-1" /&gt;
&lt;title&gt;Auto-Refresh&lt;/title&gt;
&lt;/head&gt;
&lt;body onload="window.setInterval(refreshImage, 1*1000);"&gt;
&lt;img src="https://ephratareview.com/cam/mainstate.jpg" id="cam" /&gt;
&lt;/body&gt;
&lt;/html&gt;

I just copy and pasted this from an answer I gave in an other thread. Hasn't been tested in IE7, but should be fine.

This topic might be old but i just wanted to say thanks to Ahmadinejad for the code he provided i used it on a recent project and it worked as advertised.

This topic is now closed to further replies.
 Share
Go to question listing

  • Recently Browsing   0 members

    • No registered users viewing this page.

  • Posts

    • Paint.NET can finally be downloaded from the "right" place

      By dismuter · Posted

      You could make the argument that K should not be included, but FC, the fried chicken, is not the framework, it's the product. It's the Paint in Paint.NET. A closer analogy is if KFC included the name of the deep fryer they used. HennyPennyFC.
    • Spyro: A Realm Beyond revealed by Toys for Bob, the first new entry after almost 20 years

      By DoorSnail99 · Posted

      Flying as the central point eh... As a massive Spyro fan who has replayed the Reignited Trilogy three times and the originals 4 times... I have some doubts, but maybe...
    • Apple is expanding Private Cloud Compute beyond its own data centers

      By pradeepviswav · Posted

      Apple is expanding Private Cloud Compute beyond its own data centers by Pradeep Viswanathan At WWDC 2026, as part of the improved Apple Intelligence capabilities, Apple today announced that it is expanding Private Cloud Compute (PCC), its privacy-focused cloud infrastructure for Apple Intelligence, beyond its own data centers for the first time. Private Cloud Compute was designed to handle Apple Intelligence requests that are too complex to run fully on-device. The PCC system does not store user data and does not allow Apple or anyone else to access user requests. Last year, Apple also expanded its Security Bounty program with rewards of up to $1 million for researchers who could find serious vulnerabilities in PCC. Until now, Apple's PCC data centers were using Apple's own silicon. As part of the expansion, Apple is working with Google and NVIDIA to run new Apple Intelligence workloads on Google Cloud systems powered by NVIDIA GPUs. Apple will be using this new infrastructure to execute more demanding AI tasks while maintaining the same privacy and security guarantees of PCC. The new implementation uses NVIDIA Confidential Computing with NVIDIA GPUs, Intel CPUs with TDX, and Google’s Titan chip. Apple says it has worked with Google to build additional protections beyond a traditional confidential computing deployment. Despite the expansion to third-party data centers, Apple claims that its core PCC requirements remain unchanged, including stateless computation, no privileged runtime access, non-targetability, and verifiable transparency. The company highlighted that it will continue to control the PCC software stack, and Apple devices will only trust PCC software that has been cryptographically approved by Apple. To take security to the next level, Apple mentioned that it is maintaining an append-only ledger of Google Cloud hardware that is part of the PCC fleet. The company claims this will help reduce the risk of supply chain attacks. In addition to AI infrastructure, Apple also worked with Google to use technologies behind the Gemini family of models to build the next generation of Apple Foundation Models to power Apple Intelligence features across on-device and cloud workloads. As expected, for more demanding AI tasks like agentic tool use and complex reasoning, Apple will rely on the expanded PCC infrastructure running on Google Cloud. The expansion of PCC on Google Cloud will gradually ramp toward the full set of protections during the summer preview period. As before, Apple will also publish binaries for public inspection, provide research tooling, and give researchers access to live PCC nodes in research mode through the Apple Security Bounty Program.
    • Classic Outlook vs New Outlook — Which one do you prefer and why?

      By Bdpy · Posted

      my problem with outlook (new) is that it connects only to outlook.com. all connections to external providers goes through there. Got your mail server and want to use imap directly? no way... it adds a connector on outlook.com. last bug; if your email on an external provider if the same as principal email of your microsoft account, it doesn't work...
    • Apple finally brings the slider for Liquid Glass and many other changes

      By cleverclogs · Posted

      It's the only reason I finally have an iPhone (for work) and enjoy using it so much that I'm tempted to move from android next time I need to replace my own device

  • Recent Achievements

    • Very Popular
      Captain_Eric earned a badge
      Very Popular
    • One Month Later
      amusc earned a badge
      One Month Later
    • One Month Later
      DJC50PLUS earned a badge
      One Month Later
    • Week One Done
      DJC50PLUS earned a badge
      Week One Done
    • Proficient
      Eric Biran went up a rank
      Proficient

  • Popular Contributors

    1. 1
      +primortal
      506
    2. 2
      PsYcHoKiLLa
      222
    3. 3
      ATLien_0
      92
    4. 4
      +Edouard
      86
    5. 5
      Steven P.
      81
    Show More

  • Tell a friend

    Love Neowin? Tell a friend!