|
|||||||||
|
|||||||||
|
|||||||||
 |
|||||||||
| |
||
|
|
|
| |||||||||
 |
|
|
«
Previous Thread
|
Next Thread
»
|
Thread Tools | Search this Thread | Rate Thread | Display Modes |
ASP Free Forums Sponsor:
|
|
|
|
#1
October 8th, 2004, 04:26 AM
|
|||
|
|||
Help with pre-loading and automatically sizing images
Hi
I am no programmer, just use dreamweaver mx mainly. On my website, I have a servies of photo thumbnail indexes. As each index page loads, all 10 full size images are pre-loaded into the browser cache and automatically sized. Click on a thumbnail and the image opens in a ready sized window. The javascript I use is below. The problem is that 10 images of 100k+ pre loading is a nightmare if you do not have broadband but I have found no way of doing the pre-sizing any other way. My ideal would be as follows: Open the index page (no pre-load as currently happens). Click on an image which then pre-loads, automatically sizes and then displays at the correct size. This way only 1 image at a time needs to pre-load to cache so only 100k loading rather than at present 1mb. Hope I explained this properly The code I currently use is as follows: <SCRIPT language=javascript type=text/javascript> //preload image files image_1 = new Image() image_1.src = "../portfolios/animalinsects/gatekeeper2b.jpg" image_2 = new Image() image_2.src = "../portfolios/animalinsects/_9160746b.jpg" image_3 = new Image() image_3.src = "../portfolios/animalinsects/_dragonfly1b.jpg" image_4 = new Image() image_4.src = "../portfolios/animalinsects/white_nymph_butterflyb.jpg" image_5 = new Image() image_5.src = "../portfolios/animalinsects/_9231084b.jpg" image_6 = new Image() image_6.src = "../portfolios/animalinsects/charlie1b.jpg" image_7 = new Image() image_7.src = "../portfolios/animalinsects/_9291195b.jpg" image_8 = new Image() image_8.src = "../portfolios/animalinsects/_9281148b.jpg" image_9 = new Image() image_9.src = "../portfolios/animalinsects/gatekeeper1b.jpg" image_10 = new Image() image_10.src = "../portfolios/animalinsects/_dragonfly2b.jpg" //DetectImageSize function function DetectImageSize(picName,picTitle){ picURL=picName.src newWindow=window.open(picURL,'newWin','toolbar=no, width='+picName.width+',height='+picName.height) newWindow.document.write('<html><head><title>'+picTitle+'<\/title><\/head><body background="'+picURL+'"><\/body><\/html>') newWindow.resizeBy(picName.width-newWindow.document.body.clientWidth,picName.height -newWindow.document.body.clientHeight) newWindow.focus() } //--> </SCRIPT> Any help would be appreciated Ian 
|
|
#2
October 8th, 2004, 04:47 AM
|
|||
|
|||
|
Opps some of code was missing...........
Also need this to call the function.
<p align="center"> <a href="javascript  etectImageSize(image_1,'Painted Lady')"><img border="1" src="../images/qfrontpage01a_small.jpg" URL alt="Painted Lady" width="75" height="83"></a> <a href="javascript etectImageSize(image_2,'Green-Veined White')"><img border="1" src="../images/qfrontpage01b_small.jpg" URL alt="Green-Veined White" width="94" height="75"></a> <a href="javascript etectImageSize(image_3,'Comma')"><img border="1" src="../images/qfrontpage01c_small.jpg" URL alt="Comma" width="107" height="75"></a></p>
|
|
| Viewing: ASP Free Forums > Programming > Code Bank > Help with pre-loading and automatically sizing images |
| Thread Tools | Search this Thread |
| Display Modes | Rate This Thread |
|
|
 |
|
|
|
|
|
Del.icio.us
Digg
Google
Spurl
Blink
Furl
Simpy
Y! MyWeb
Linear Mode
