Jump to content

[SOLVED] preload image...


Mr_J

Recommended Posts

Hi all,

I want to preload some 1.5mb (x17)images to speedup things.

Please just tell me wtf must I do... 2 problems:

1. My code: <head>(found on w3schools)

<SCRIPT language="JavaScript">
<!--
  pic1= load Img(230,172); 
  pic1.src="http://www.sub-domain.net/img/folder/file.jpg"; 
function LoadImage()
{
document.getElementById('myImage').src=pic1.src;

}
//-->
</SCRIPT>

</head>

 

<body>

<table border="0">

	<tr>
		<th width="230" bordercolor="#FFFF00" bordercolorlight="#C0C0C0" bordercolordark="#808080" height="153"><p align='top'>Quen</p>
<img id="myImage" src="http://www.sub-domain.net/img/folder/file.jpg">
</th></tr></table>

 

Then, it seems I do not have access to the files.

The site is a sub-domain of www.some-site.com. I browse with explorer (windows vista) to ftp.somesite.com/public_html/sub-domain.net/img/folder/file.jpg but when I type the path in the browser(FF), I get 403 You don't have permission to access www.sub-domain/img/folder/file.jpg

 

If I load some other images i.e. the bg.jpg, it loads BUT, the bg.jpg image is in www.sub-domain.net/img/bg.jpg

 

I have tried a number of ways but no avail.

Please help me

Thanx

J

 

DO NOT WALK IN THE TRAIL OF ANOTHER, RATHER LEAVE A PATH FOR OTHERS TO FOLLOW

Link to comment
https://forums.phpfreaks.com/topic/163625-solved-preload-image/
Share on other sites

Reading through your post I notice you have 2 problems.

1. the javascript pre-load thing

2. image path issue

 

To receive an answer which suits your needs I suggest you clarify your specific problem a bit more concering your image preloading.  The thing is the first time an image get's loaded into your browser it will need to load that image, pre-loading won't speed up a thing. There is no magic javascript recipe to make imageloading faster.Why do you need the the image to be pre-loaded? Is there a javascript function depends on the image that needs to be loaded first?

 

The image path issue I find a bit confusing can you clarify that?

 

 

Link to comment
https://forums.phpfreaks.com/topic/163625-solved-preload-image/#findComment-863378
Share on other sites

Ok, Got it right. The load is WAY faster than it used to be...

This is how I got it right...

<script language="JavaScript">
function preloader() 
{
     // counter
     var i = 0;


     // create object
     imageObj = new Image();


     // set image list
     images = new Array();
     images[0]="http://www.site.za.net/fotos/index/1.jpg"
     images[1]="http://www.site.za.net/fotos/index/DSCF0381.JPG"
     images[2]="http://www.site.za.net/fotos/index/Jessica034.JPG"
     images[3]="http://www.site.za.net/fotos/index/krap.JPG"
     images[4]="http://www.site.za.net/fotos/index/5.jpg"
     
     // start preloading
     for(i=0; i<=3; i++) 
     {
          imageObj.src=images[i];
     }

} 

</script>
<body>
<img src="fotos/index/1.jpg">
<img src="fotos/index/DSCF0381.JPG">
<img src="fotos/index/Jessica034.JPG">
<img src="fotos/index/krap.JPG">
<img src="fotos/index/5.jpg">


</body>
</html>

Thanks for the late reply anyway...

 

 

Link to comment
https://forums.phpfreaks.com/topic/163625-solved-preload-image/#findComment-863383
Share on other sites

Ok, Got it right. The load is WAY faster than it used to be...

This is how I got it right...

<script language="JavaScript">
function preloader() 
{
     // counter
     var i = 0;


     // create object
     imageObj = new Image();


     // set image list
     images = new Array();
     images[0]="http://www.site.za.net/fotos/index/1.jpg"
     images[1]="http://www.site.za.net/fotos/index/DSCF0381.JPG"
     images[2]="http://www.site.za.net/fotos/index/Jessica034.JPG"
     images[3]="http://www.site.za.net/fotos/index/krap.JPG"
     images[4]="http://www.site.za.net/fotos/index/5.jpg"
     
     // start preloading
     for(i=0; i<=3; i++) 
     {
          imageObj.src=images[i];
     }

} 

</script>
<body>
<img src="fotos/index/1.jpg">
<img src="fotos/index/DSCF0381.JPG">
<img src="fotos/index/Jessica034.JPG">
<img src="fotos/index/krap.JPG">
<img src="fotos/index/5.jpg">


</body>
</html>

Thanks for the late reply anyway...

Are you sure? I see a preload function but I do not see the function being called. Have you done a test clearing the cache of your browser while testing? 

Link to comment
https://forums.phpfreaks.com/topic/163625-solved-preload-image/#findComment-863387
Share on other sites

Ok, Got it right. The load is WAY faster than it used to be...

This is how I got it right...

<script language="JavaScript">
function preloader() 
{
     // counter
     var i = 0;


     // create object
     imageObj = new Image();


     // set image list
     images = new Array();
     images[0]="http://www.site.za.net/fotos/index/1.jpg"
     images[1]="http://www.site.za.net/fotos/index/DSCF0381.JPG"
     images[2]="http://www.site.za.net/fotos/index/Jessica034.JPG"
     images[3]="http://www.site.za.net/fotos/index/krap.JPG"
     images[4]="http://www.site.za.net/fotos/index/5.jpg"
     
     // start preloading
     for(i=0; i<=3; i++) 
     {
          imageObj.src=images[i];
     }

} 

</script>
<body>
<img src="fotos/index/1.jpg">
<img src="fotos/index/DSCF0381.JPG">
<img src="fotos/index/Jessica034.JPG">
<img src="fotos/index/krap.JPG">
<img src="fotos/index/5.jpg">


</body>
</html>

Thanks for the late reply anyway...

Are you sure? I see a preload function but I do not see the function being called. Have you done a test clearing the cache of your browser while testing? 

 

Also, this (among other things):

 

for(i=0; i<=3; i++) 
{
   imageObj.src=images[i];
}

 

Isn't doing what you think it's doing.

Link to comment
https://forums.phpfreaks.com/topic/163625-solved-preload-image/#findComment-863390
Share on other sites

Archived

This topic is now archived and is closed to further replies.

×
×
  • Create New...

Important Information

We have placed cookies on your device to help make this website better. You can adjust your cookie settings, otherwise we'll assume you're okay to continue.