944,181 Members | Top Members by Rank

Web Development > JavaScript / DHTML / AJAX > preloading image (white page between) problem
Ad:
Permalink
Nov 10th, 2007
0

preloading image (white page between) problem

Expand Post »
Hello again, Im using the code below in a child page (popup), the images
are called from the parent page. When the changer is running, the child page goes white between images. I realise this is happening because the Images are not cached (yet) on the users browser.
I tried preloading images with the 2nd code below in the childpage head
and in the parent page head and both. no joy, dosent seem to actually 'preload' the pics. (i also gave definitions by adding width & height attributes but no difference. Is there anyway to solve this problem?

preveiw (click yellow highlighted link 'Pre-view active topics' near top)
note: first image (green python) is the childpage body BG (css)
In previous Instance of the changer code, links were called from photobucket.com, at that point, the images were cacheing after loading (so after the full cycle 15 pics there was no white between), I though calling the pics from the same domain would be better but now it dosent cache at all.
notice pics are attachments in the parent page, is that why no cache?

http://herproom.5.forumer.com/index.php?

[code language="javascript"]
<script LANGUAGE="JavaScript">
<!--
var BackgroundChangeIndex = 0;
var wistol = new Array
("http://herproom.5.forumer.com/index.php?act=Attach&type=post&id=9886","http://herproom.5.forumer.com/index.php?act=Attach&type=post&id=9887","http://herproom.5.forumer.com/index.php?act=Attach&type=post&id=9888","http://herproom.5.forumer.com/index.php?act=Attach&type=post&id=9889","http://herproom.5.forumer.com/index.php?act=Attach&type=post&id=9890","http://herproom.5.forumer.com/index.php?act=Attach&type=post&id=9891","http://herproom.5.forumer.com/index.php?act=Attach&type=post&id=9892","http://herproom.5.forumer.com/index.php?act=Attach&type=post&id=9893","http://herproom.5.forumer.com/index.php?act=Attach&type=post&id=9894","http://herproom.5.forumer.com/index.php?act=Attach&type=post&id=9895","http://herproom.5.forumer.com/index.php?act=Attach&type=post&id=9896","http://herproom.5.forumer.com/index.php?act=Attach&type=post&id=9897","http://herproom.5.forumer.com/index.php?act=Attach&type=post&id=9898","http://herproom.5.forumer.com/index.php?act=Attach&type=post&id=9899","http://herproom.5.forumer.com/index.php?act=Attach&type=post&id=9900");
function SetBackgroundImage()
{
var BackgroundImage;
BackgroundChangeIndex++;
if (BackgroundChangeIndex >= wistol.length)
{
BackgroundChangeIndex = 0;
}
BackgroundImage = wistol[BackgroundChangeIndex]
document.body.style.cssText="background: url(" + BackgroundImage + ");" + "background-attachment: fixed; center; center;"
setTimeout("SetBackgroundImage()", 10000)
}
//-->
</script>
[/code]

JavaScript / DHTML / AJAX Syntax (Toggle Plain Text)
  1. <SCRIPT language="JavaScript"> 
  2. <!-- 
  3. if (document.images) 
  4. { 
  5. pic1= new Image(); 
  6. pic1.src="http://herproom.5.forumer.com/index.php?act=Attach&type=post&id=9886"; 
  7. pic2= new Image(); 
  8. pic2.src="http://herproom.5.forumer.com/index.php?act=Attach&type=post&id=9887"; 
  9. pic3= new Image(); 
  10. pic3.src="http://herproom.5.forumer.com/index.php?act=Attach&type=post&id=9888"; 
  11. pic3= new Image(); 
  12. pic3.src="http://herproom.5.forumer.com/index.php?act=Attach&type=post&id=9889"; 
  13. pic3= new Image(); 
  14. pic3.src="http://herproom.5.forumer.com/index.php?act=Attach&type=post&id=9890"; 
  15. pic3= new Image(); 
  16. pic3.src="http://herproom.5.forumer.com/index.php?act=Attach&type=post&id=9891"; 
  17. pic3= new Image(); 
  18. pic3.src="http://herproom.5.forumer.com/index.php?act=Attach&type=post&id=9892"; 
  19. pic3= new Image(); 
  20. pic3.src="http://herproom.5.forumer.com/index.php?act=Attach&type=post&id=9893"; 
  21. pic3= new Image(); 
  22. pic3.src="http://herproom.5.forumer.com/index.php?act=Attach&type=post&id=9894"; 
  23. pic3= new Image(); 
  24. pic3.src="http://herproom.5.forumer.com/index.php?act=Attach&type=post&id=9895"; 
  25. pic3= new Image(); 
  26. pic3.src="http://herproom.5.forumer.com/index.php?act=Attach&type=post&id=9896"; 
  27. pic3= new Image(); 
  28. pic3.src="http://herproom.5.forumer.com/index.php?act=Attach&type=post&id=9897"; 
  29. pic3= new Image(); 
  30. pic3.src="http://herproom.5.forumer.com/index.php?act=Attach&type=post&id=9898"; 
  31. pic3= new Image(); 
  32. pic3.src="http://herproom.5.forumer.com/index.php?act=Attach&type=post&id=9899"; 
  33. pic3= new Image(); 
  34. pic3.src="http://herproom.5.forumer.com/index.php?act=Attach&type=post&id=9900"; 
  35. } 
  36. //--> 
  37. </SCRIPT>


Have reverted back to offsite links for changer script and images are now cached after the full cycle (15 pics) Is there a way to stop the flicker?
Similar Threads
Reputation Points: 11
Solved Threads: 6
Posting Whiz in Training
Inny is offline Offline
293 posts
since Oct 2005
Permalink
Nov 11th, 2007
0

Re: preloading image (white page between) problem

> pic1.src="http://herproom.5.forumer.com/index.php?act=Attach&type=post&id=9886";
AFICT, the src attribute requires an absolute image path. In other words, it requires an URL and not an URI.

From what I can see, you are trying to send a request to the server with some given parameters which would after required processing would return an image as a response. If yes, then no, this won't work. Something like pic1.src="http://herproom.5.forumer.com/images/image1.jpg would be a good thing to try out. :-)
Super Moderator
Featured Poster
Reputation Points: 3241
Solved Threads: 719
Failure as a human
~s.o.s~ is offline Offline
8,873 posts
since Jun 2006
Permalink
Nov 11th, 2007
0

Re: preloading image (white page between) problem

I tried the Preload Images Script with Full absolute urls aswell, it made no difference! Did you check out the link?
Last edited by Inny; Nov 11th, 2007 at 6:24 pm.
Reputation Points: 11
Solved Threads: 6
Posting Whiz in Training
Inny is offline Offline
293 posts
since Oct 2005

This thread is more than three months old

No one has posted to this discussion for at least three months. Please let old threads die and do not reply to them unless you feel you have something new and valuable to contribute that absolutely must be added to make the discussion complete. Otherwise, please start a new thread in this forum instead.
Message:
Previous Thread in JavaScript / DHTML / AJAX Forum Timeline: ClamShell Menu Not Working in Foxfire
Next Thread in JavaScript / DHTML / AJAX Forum Timeline: Javascript- On selection appear image..





About Us | Contact Us | Advertise | Acceptable Use Policy
Forum Index | Build Custom RSS Feed


Follow us on Twitter


© 2011 DaniWeb® LLC