Question

I am working with a very outdated templated site that does not let me change anything in the top portion of the site. The Flash slideshow no longer works properly, so I was wondering if there was any way Javascript/JQuery can be added to the accessable part of the site that will dynamically replace the existing flash slideshow with a Javascript slideshow I have made?

The site is: http://www.familymattersteam.com/

Thanks in advance!

Answer 1

I added the following code to the “script footer” portion of the site’s back end. I just started learning Javascript about a week ago, and I borrowed this code from another out of date site, so I’m sure its painful to look at. It works though!

Essentially all I did was used the innHTML command to replace the contents in the “SlideShow” ID with code for a Javascript slideshow.

var t;
var slideShowSpeed = 5000;
var crossFadeDuration = 2;

var PicA = new Array();

PicA[0] = '/Repository/1/4/1/0/7/9/141079/template_files/slide1.jpg';
PicA[01] = '/Repository/1/4/1/0/7/9/141079/template_files/slide2.jpg';
PicA[02] = '/Repository/1/4/1/0/7/9/141079/template_files/slide3.jpg';
PicA[03] = '/Repository/1/4/1/0/7/9/141079/template_files/slide4.jpg';
PicA[04] = '/Repository/1/4/1/0/7/9/141079/template_files/slide5.jpg';

var j = 0;
var p = PicA.length; 
var preLoadA = new Array();

for (i = 0; i < p; i++) {
preLoadA[i] = new Image();
preLoadA[i].src = PicA[i];
};

function runSlideShowA() {

if (document.all) {
document.images.SlideShowA.style.filter='blendTrans(duration=2)';
document.images.SlideShowA.style.filter='blendTrans(duration=crossFadeDuration)';
document.images.SlideShowA.filters.blendTrans.Apply();
};

document.images.SlideShowA.src = preLoadA[j].src;

if (document.all) {
document.images.SlideShowA.filters.blendTrans.Play();
};

j = j + 1;
if (j > (p - 1)) j = 0;
t = setTimeout('runSlideShowA()', slideShowSpeed);
};

newSlide = document.getElementById('SlideShow'); 
newSlide.innerHTML = '<img src="/Repository/1/4/1/0/7/9/141079/template_files/slide1.jpg" name="SlideShowA" width="874" height="206">';

runSlideShowA();