Re: Picture Fade

Tech Tip: Click here to run a free scan for Windows Errors and optimize PC performance

From: Andrew Murray (SPAMadBUSTERmurray_at_iinet.net.au)
Date: 08/13/04 

Date: Fri, 13 Aug 2004 18:00:10 +0800

The script below is from this site:

http://www.davidpye.com/freeware/

Navigate to "Javascript Vault" - it contains around 700 (!!) different
javascripts from banner tickers to scrollers to image faders and slide shows and
a lot more. Very useful and a lot of things included that are often asked about
on this Newsgroup too, all categorised. Free.

Below is the code for the image fader/slideshow.

Sorry for the copy and paste of this script but I believe this is what you want.

You need to change your images in the variables at
pic[1]
pic[2]
pic[3]
pic[4]

to your own images then you insert the initial image with a <img src> tag (as
below). and start the script with "onload" even in the <body>, although you could
change this to onclick() if you wanted to I expect and start it by clicking a
hyperlink.

!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 3.2 Final//EN">
<HTML>
<HEAD>
<LINK href="general.css" rel="style***" type="text/css">

<SCRIPT LANGUAGE="JavaScript">
<!-- Original: CodeLifter.com (support@codelifter.com) -->
<!-- Web Site: http://www.codelifter.com -->
<!-- Begin
// Set slideShowSpeed (milliseconds)
var slideShowSpeed = 5000;
// Duration of crossfade (seconds)
var crossFadeDuration = 3;
// Specify the image files
var Pic = new Array();
// to add more images, just continue
// the pattern, adding to the array below

Pic[0] = 'toad.jpg'
Pic[1] = 'lizard.jpg'
Pic[2] = 'chameleon.jpg'
Pic[3] = 'gecko.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.filters.blendTrans.Apply();
}
document.images.SlideShow.src = preLoad[j].src;
if (document.all) {
document.images.SlideShow.filters.blendTrans.Play();
}
j = j + 1;
if (j > (p - 1)) j = 0;
t = setTimeout('runSlideShow()', slideShowSpeed);
}
// End -->
</script>

</HEAD>

<BODY Background=../graphics/grayback.jpg onLoad="runSlideShow()">
<center><BR><BR>
<table border="0" cellpadding="0" cellspacing="0">
<tr>
<td id="VU" height=190 width=330>
<img src="toad.jpg" name='SlideShow' width=330 height=190>
</td>
</tr>
</table>

</center>
</BODY>
</HTML>

_______________________________

"Jim Buyens" <news@interlacken.com> wrote in message
news:542901c480a8$ab2b4fe0$a401280a@phx.gbl...
> You can try using a progressive JPEG, but this wouldn't
> provide the fade-out, and the timing wouldn't be precise.
>
> You might look into animated GIFs as well, although then
> you're limited to 256 colors. And of course, you need a
> picture editor that can do animated GIFs'
>
> Otherwise, I believe you'd have to program this in
> Macromedia Flash or something similar.
>
> Jim Buyens
> Microsoft FrontPage MVP
> http://www.interlacken.com
> Author of:
> *----------------------------------------------------
> |\---------------------------------------------------
> || Microsoft Office FrontPage 2003 Inside Out
> ||---------------------------------------------------
> || Web Database Development Step by Step .NET Edition
> || Microsoft FrontPage Version 2002 Inside Out
> || Faster Smarter Beginning Programming
> || (All from Microsoft Press)
> |/---------------------------------------------------
> *----------------------------------------------------
>
>
>
> >-----Original Message-----
> >Can you make a picture fade in and out in FrontPage?
> >.
> >

Quantcast