Porting BlendTrans functionality to other browsers

[wheelhouse5]

I've got a file that uses the blendTrans style for a photo slideshow. It works fine with Internet Explorer, but not with any other browsers. What do I need??? Thanks, here's my slideshow code...

// Set the slideshow speed (in milliseconds)
var SlideShowSpeed = 3000;
 
// Set the duration of crossfade (in seconds)
var CrossFadeDuration = 3;
 
function runSlideShow(){
if (document.form1.automatic.checked){
    if (currentIndx<imagesPreloaded.length){
currentIndx=currentIndx
}
else {
 currentIndx=1
}    
document.getElementById('photo').style.filter="blendTrans(duration=2)";
document.getElementById('photo').style.filter="blendTrans(duration=CrossFadeDuration)";
document.getElementById('photo').filters.blendTrans.Apply();}
document.getElementById('photo').src = imagesPreloaded[currentIndx].src
document.getElementById('number').innerHTML=number[currentIndx];
if (document.form1.automatic.checked) document.getElementById('photo').filters.blendTrans.Play();
currentIndx = currentIndx + 1;
if (currentIndx > (imagesPreloaded.length)) currentIndx=1;
var delay2 = setTimeout('runSlideShow()', SlideShowSpeed);
}
 

LINKS

HTML: http://njn.net/edtest/photogalleryFADE.html
EXTERNAL JS: http://njn.net/edtest/pgfade.js

[pbmods]

Heya, Wheelhouse. Welcome to TSDN!

Please use CODE tags when posting source code. See the REPLY GUIDELINES on the right side of the page next time you post.

Changed thread title to better describe the problem (did you know that threads whose titles contain phrases such as, 'need help' actually get FEWER responses?).

[acoder]

I've got a file that uses the blendTrans style for a photo slideshow. It works fine with Internet Explorer, but not with any other browsers. What do I need???

Use the opacity property. This will work in newer browsers. For older Mozilla browsers, you can use moz-opacity (mozOpacity in Javascript).

Use setTimeout or setInterval to control the blending effect by either decreasing or increasing the opacity value.

[wheelhouse5]

Does this mean I need all new coding for the slideshow, or is it something that can just be added. Sorry, I'm a Javascript novice!

[gits]

hi ...

yep ... unfortunately you have to test/find out what css is supported by all browsers you want to support ;) ... an other way would be to use a better effect-lib that does the job for you ... otherwise you have to adapt all for yourself ... but it is not that much ... usually you only need to add that other style-settings to the script since the different browsers only support one of them and ignore the others ... or you set the styles conditionally dependend to the browser, that would be much cleaner because you avoid parse errors due to the ignoring or better the none ignoring parsing of 'wrong' css-rules that might be implemented in the future

kind regards