Page 1 of 1
reload a jpg that open in new window
Posted: Sun 05 Oct 2014 4:28 am
by ace2
I have a highlights page that refreshes the images every X seconds which works fine. These 6 stills are clickable which opens them in a new window, but i find the image is a cached version at times, what would be the best method making them reload completely once opened??
below is part of the main page refresh code i use, which is working great
Code: Select all
<script type="text/javascript">
refreshImage = function()
{
img = document.getElementById("im1");
img.src="7am.jpg?rand=" + Math.random();
</script>
And i add that into the page which refreshes fine.
Code: Select all
<a href="7am.jpg" target="_blank" ><img src="http://users.on.net/~ace2/7am.jpg" alt="7am.jpg" id="im1"></a><span style="color: #1A20CC">TAKEN AT 7AM</span>
But the clickable image sometimes loads a cached version instead of the refresh/reloaded version.
How could i fix this little issue, I know it's something really really simple!!!
Pages address is
http://www.users.on.net/~ace2/highlights.htm if needed
Re: reload a jpg that open in new window
Posted: Sun 05 Oct 2014 6:55 am
by rogerthn
My php code to solve this issue
Function to get the timestamp of a file
Code: Select all
function timestamp($filename)
{
if (file_exists($filename))
return date ("YmdHis", filemtime($filename));
else
return "File $filename not found";
}
Add the timestamp to href
Code: Select all
$image_timestamp = timestamp("image.jpg");
print ("<div align=\"center\"><a href=\"image.jpg\"><img src=\"image.jpg[b]?$image_timestamp[/b]\" height=\"85%\" alt=\"Latest picture\" title=\"Latest picture\"></a></div>\n");
Addition of
?$image_timestamp to href does the trick for me
Re: reload a jpg that open in new window
Posted: Sun 05 Oct 2014 7:21 am
by ace2
rogerthn wrote:My php code to solve this issue
Function to get the timestamp of a file
Code: Select all
function timestamp($filename)
{
if (file_exists($filename))
return date ("YmdHis", filemtime($filename));
else
return "File $filename not found";
}
Add the timestamp to href
Code: Select all
$image_timestamp = timestamp("image.jpg");
print ("<div align=\"center\"><a href=\"image.jpg\"><img src=\"image.jpg[b]?$image_timestamp[/b]\" height=\"85%\" alt=\"Latest picture\" title=\"Latest picture\"></a></div>\n");
Addition of
?$image_timestamp to href does the trick for me
Will php work with my HTML, my ISP doesn't allow/uee php according to there personal web space section...
Re: reload a jpg that open in new window
Posted: Sun 05 Oct 2014 7:39 am
by rogerthn
It should be possible to do something similar with javascript.
The line "img.src="7am.jpg?rand=" + Math.random();" in your refreshImage function does it.
Re: reload a jpg that open in new window
Posted: Sun 05 Oct 2014 8:49 am
by mcrossley
Try...
Code: Select all
<script type="text/javascript">
refreshImage = function()
{
img = document.getElementById("im1");
img.src="7am.jpg?rand=" + Math.random();
link = document.getElementById("lnk1");
link.href = "7am.jpg?rand= + Math.random();
</script>
Code: Select all
<a id="lnk1" href="7am.jpg" target="_blank" ><img src="http://users.on.net/~ace2/7am.jpg" alt="7am.jpg" id="im1"></a><span style="color: #1A20CC">TAKEN AT 7AM</span>
Re: reload a jpg that open in new window
Posted: Sun 05 Oct 2014 9:01 am
by ace2
rogerthn wrote:It should be possible to do something similar with javascript.
The line "img.src="7am.jpg?rand=" + Math.random();" in your refreshImage function does it.
That line updates the page images, but not the link ones opening in a new window.
Re: reload a jpg that open in new window
Posted: Sun 05 Oct 2014 9:05 am
by ace2
mcrossley wrote:Try...
Code: Select all
<script type="text/javascript">
refreshImage = function()
{
img = document.getElementById("im1");
img.src="7am.jpg?rand=" + Math.random();
link = document.getElementById("lnk1");
link.href = "7am.jpg?rand= + Math.random();
</script>
Code: Select all
<a id="lnk1" href="7am.jpg" target="_blank" ><img src="http://users.on.net/~ace2/7am.jpg" alt="7am.jpg" id="im1"></a><span style="color: #1A20CC">TAKEN AT 7AM</span>
Thanks, I'll give that a go
Re: reload a jpg that open in new window
Posted: Sun 05 Oct 2014 9:31 am
by ace2
OK, that's all done, edited page on a nexus 4 phone, not an easy job I can tell you!!!
Now just need to test it.
Thanks mcrossley......
Re: reload a jpg that open in new window
Posted: Tue 07 Oct 2014 2:18 am
by ace2
mcrossley wrote:Try...
Code: Select all
link.href = "7am.jpg?rand= + Math.random();
Works now after adding the missing " after rand=........
Re: reload a jpg that open in new window
Posted: Tue 07 Oct 2014 6:38 am
by mcrossley
Ah yes, it was tryped on my phone.
Re: reload a jpg that open in new window
Posted: Tue 07 Oct 2014 9:49 am
by ace2
mcrossley wrote:Ah yes, it was tryped on my phone.
HEY, that's my excuse!!!