...

View Full Version : Slideshow sizing of pictures



allyson
08-03-2002, 07:11 AM
Hi coding forum

Below is the code for a slideshow that I have been developing. It is located at http://homepages.ihug.co.nz/~usateden/panacea/slideshow

It displays pictures in the main frame, but the size of the images is resized to a certain size. For example the the image called Potters Park is really 500 x 800. For some reason the pictures are being forced into 400 x 279 size. (I know this size is created in code 2, but I have no idea how to free up the size restriction). I want each image to be displayed as the size that I have originally sized them too. (I hope this makes sense).

Code 1

<html>

<head>
<title>Panacea Arts Trust</title>
</head>

<body background="bg1.jpg">

<table border="0" cellpadding="0">
<tr>
<td width="100%"><form method="POST" name="rotater">
<div align="center"><center><p><script language="JavaScript">
var photos=new Array()
var text=new Array()
var which=0
var what=0

/*Images */
photos[0]="../Cards/Potters Park.jpg"
photos[1]="../Cards/Flowers for Elizabeth.jpg"
photos[2]="../Cards/Busy Lizzies.jpg"
photos[3]="../Cards/Racing Yachts.jpg"
photos[4]="../Cards/Nana Mouskouri.jpg"

/*Descriptions*/
text[0]="Potters Park, by Mario Franchini"
text[1]="Flowers for Elizabeth, by Dale Bush"
text[2]="Busy Lizzies, by Lizzi Collenette"
text[3]="Racing Yachts, by Lynda Rodgers"
text[4]="Nana Mouskouri, by William Webb"

function preloadImages(){
//load first slide
top.frames["main"].document.images.photoslider.src=photos[0];
top.frames["description"].document.rotater.description.value=text[0];


//pre-load other slides
for (var i=1;i<photos.length;i++){
image = new Image(photos[i]);
}
}

window.onload=preloadImages;



function backward(){
if (which>0){

window.status=''
which--
top.frames["main"].document.images.photoslider.src=photos[which] ;
what--
top.frames["description"].document.rotater.description.value=text[what];
}
}

function forward(){
if (which<photos.length-1){

which++
top.frames["main"].document.images.photoslider.src=photos[which] ;
what++
top.frames["description"].document.rotater.description.value=text[what];
}
else window.status='End of gallery'
}



</script><input type="button"
value="&lt;&lt;Back" name="B2" onClick="backward()"><input type="button"
value="Next&gt;&gt;" name="B1" onClick="forward()" </center><br>
<input type="button" value="Start Over" name="B3" onClick="which=1;what=1;backward()"></p>
</center></div>
</form>
</td>
</tr>
</table>

<p align="center">&nbsp;</p>
</body>
</html>

Code 2

<html>

<head>
<title>Panacea Arts Trust </title>

</head>

<body bgcolor="#000000" text="#FFFFFF">

<p align="center"><img src="../Cards/Busy%20Lizzies.jpg" width="400" height="279"
alt="Busy Lizzies.jpg (29439 bytes)"></p>
</body>
</html>

Pooh
08-03-2002, 08:30 AM
Try taking the width and height dimensions out of code 2.

<p align="center"><img name="photoslider" src="../Cards/Busy%20Lizzies.jpg" > </p>



EZ Archive Ads Plugin for vBulletin Copyright 2006 Computer Help Forum