PDA

View Full Version : Javascript Slideshow compatibility issue


hous
06-26-2006, 03:10 PM
I have a script for a javascript slideshow that has image transitions (fade), however, this effect only works in IE. Is it possible to get it to work in other browsers, or should I just make a flash slideshow, instead? (anyone know of a good flash auto-running slideshow template? :))

Here is the page (http://dogwoodcafe.com/dev/arts2.html) it is being tested on, and this is the script:

<!-- Begin
NewImg = new Array (
"images/events_02.gif",
"images/events_04.gif"
);
var p = NewImg.length;
var preLoad = new Array();
for (i = 0; i < p; i++) {
preLoad[i] = new Image();
preLoad[i].src = NewImg[i];
}
var ImgNum = 0;
var ImgLength = NewImg.length - 1;
//Time delay between Slides in milliseconds
var delay = 3500;
var t;
var lock = false;
var run;

function chgImg(direction) {
if (document.all) {
document.images.SlideShow.style.filter="blendTrans(duration=2)";
document.images.SlideShow.style.filter="blendTrans(duration=crossFadeDurati¬on)";
document.images.SlideShow.filters.blendTrans.Apply();
}
if (document.all) {
document.images.SlideShow.filters.blendTrans.Play();
}
if (document.images) {
ImgNum = ImgNum + direction;
if (ImgNum > ImgLength) {
ImgNum = 0;
}
if (ImgNum < 0) {
ImgNum = ImgLength;
}
document.SlideShow.src = NewImg[ImgNum];
}
}
function auto() {
if (lock == true) {
lock = false;
window.clearInterval(run);
}
else if (lock == false) {
lock = true;
run = setInterval("chgImg(1)", delay);
}
}
// End -->

RysChwith
06-26-2006, 05:24 PM
Possible, yes. But you'll have to pretty much rewrite the cmgImg function. Rather than playing with transitions, you'll have to incrementally modify the opacity, -moz-opacity, and -khtml-opacity CSS attributes to get the fade.

This will catch most browsers. The only major one you'll miss is Opera. Unfortunately, I know of nothing that can be done about that.

Rys

hous
06-27-2006, 03:46 PM
Thanks Rys,

I ended up just going with a flash slideshow that I'm testing here:

http://www.dogwoodcafe.com/dev/drinks2.html