/    Sign up×
Community /Pin to ProfileBookmark

slideshow image size

Copy linkTweet thisAlerts:
Apr 03.2003

I downloaded one of the Slideshow codes which allow a group of images (i.e. *.jpg) to fade in and out, one by one. However, in all of the slideshows, I note that each of the images must be of the same size. If not, they look distorted (compressed or stretched out).

What code segment can be inserted into the source code to accept the image regardless of size (within reason, of course)? I use Win98 and IE6.0.

Thanks

to post a comment
JavaScript

2 Comments(s) ↴

Copy linkTweet thisAlerts:
@russ801Apr 03.2003 — I have a slide show that has images that are either landscape or portrait.

I use a table to control the layout. I am sure that there are some CSS methods that are better, but that is for phase 2?. The key is not to size the image, size the cell.

Russ

<SCRIPT language="JavaScript1.2">



<!-- Original: CodeLifter.com ([email protected]) -->

<!-- Web Site: http://www.codelifter.com -->

<!-- This script and many more are available free online at -->

<!-- The JavaScript Source!! http://javascript.internet.com -->

<!-- Begin

// Set slideShowSpeed (milliseconds)

var slideShowSpeed = 2000;

// Duration of crossfade (seconds)

var crossFadeDuration = 0;

// Specify the image files

var Pic = new Array();

// to add more images, just continue

// the pattern, adding to the array below

Pic[0] = 'Onstage/Opera0022V.jpg'

Pic[1] = 'Onstage/Opera0054V.jpg'

Pic[2] = 'Onstage/Opera0055V.jpg'

Pic[3] = 'Onstage/Opera0037V.jpg'

// do not edit anything below this line

var t;

var j = 0;

var p = Pic.length;

var preLoad = new Array();

for (i = 0; i < p; i++) {

preLoad[i] = new Image();

preLoad[i].src = Pic[i];

}

function runSlideShow() {

if (document.all) {

//document.images.SlideShow.style.filter="blendTrans(duration=2)";

document.images.SlideShow.style.filter="blendTrans(duration=crossFadeDuration)";

}



document.images.SlideShow.src = preLoad[j].src;

if (document.all) {

document.images.SlideShow.filters.blendTrans.Apply();



document.images.SlideShow.filters.blendTrans.Play();

}

j = j + 1;

if (j > (p - 1)) j = 0;

t = setTimeout('runSlideShow()', slideShowSpeed);

}

</SCRIPT> </HEAD>

<BODY ><SCRIPT language="JavaScript1.2" type="text/javascript">

var winpicload=window.onload;

window.onload=function()

{

if (winpicload) winpicload();

runSlideShow();

}







</SCRIPT>

<BR><BR>

<BR>

<TABLE border="0" height="385" cellpadding="0" cellspacing="0" align="left">

<COL span="1" align="left">

<TBODY>

<TR align="left">

<TD align="left" height="285" valign="top" width="390"><IMG src="Onstage/Opera0022V.jpg" name="SlideShow" border="0"></TD>

</TR>

</TBODY>

</TABLE>

</BODY>

</HTML>
Copy linkTweet thisAlerts:
@homeportauthorApr 04.2003 — Worked fine. Very creative. Thanks.
×

Success!

Help @homeport spread the word by sharing this article on Twitter...

Tweet This
Sign in
Forgot password?
Sign in with TwitchSign in with GithubCreate Account
about: ({
version: 0.1.9 — BETA 5.16,
whats_new: community page,
up_next: more Davinci•003 tasks,
coming_soon: events calendar,
social: @webDeveloperHQ
});

legal: ({
terms: of use,
privacy: policy
});
changelog: (
version: 0.1.9,
notes: added community page

version: 0.1.8,
notes: added Davinci•003

version: 0.1.7,
notes: upvote answers to bounties

version: 0.1.6,
notes: article editor refresh
)...
recent_tips: (
tipper: @AriseFacilitySolutions09,
tipped: article
amount: 1000 SATS,

tipper: @Yussuf4331,
tipped: article
amount: 1000 SATS,

tipper: @darkwebsites540,
tipped: article
amount: 10 SATS,
)...