Hi, I have a javascript based slideshow I am using that has a main image, title, brief description, controls, and then at the bottom, 4 thumbnail images with titles.

What I am trying to do is remove the thumbnail images and titles. However, when I do that, the main image, title and description disappears too.

Here is the slide show:

http://dev.teambeacon.com/salisburyfire/default.asp

Here is the javascript I'm using:

var bEnv = {
MacIE: ((navigator.userAgent.indexOf("IE") > -1) && (navigator.userAgent.indexOf("Mac") > -1)) ? 1 : 0
};

/* Implement array.push for browsers which don't support it natively.
Please remove this if it's already in other code */
if(Array.prototype.push == null) {
Array.prototype.push = function() {
for(var i = 0; i < arguments.length; i++) {
this[this.length] = arguments[i];
};
return this.length;
};
};

/**
* Add/Remove Event Listeners
**/
var Events = {
addEvent: function(el, evType, fn, useCapture) {
if(Events) Events.addtoList(el, evType, fn);
if (el.addEventListener) {
el.addEventListener(evType, fn, useCapture);
return true;
} else if (el.attachEvent) {
var r = el.attachEvent("on"+evType, fn);
return r;
} else {
return el["on" + evType] = fn;
}
},

// Remove event listeners
removeEvent: function(el, evType, fn) {
if (el.removeEventListener) {
el.removeEventListener(evType, fn, false);
return true;
} else if (el.detachEvent) {
var r = el.detachEvent("on"+evType, fn);
return r;
} else {
return el["on" + evType] = null;
}
},

// list events
eventList: [],
// add event to list
addtoList: function(el, evType, fn) {
Events.eventList.push(arguments);
},
// run through array and detach events
removeEvents: function() {
for (var i = Events.eventList.length-1; i >= 0; i--) {
var obj = Events.eventList[i];
Events.removeEvent(obj[0], obj[1], obj[2]);
}
}
};

/* Top Story sequencial blurb display */
function TSSeq(data) {
var self = this;
this.data = data;
this.timeout = this.data.timeout;
this.count = this.data.timeout; // countdown
this._ppState = this.data.autoplay; // 0 pause, 1 play
this._ppBtn = [];
this.currentslide = 0; // default to 0
this.slideImages = {}; // new Object for preloaded slides
this.slideThumbs = {}; // new Object for preloaded thumbs
this._intervalId = "";

/**
* Define methods...
**/
if (typeof TSSeq._initialized == "undefined") {
TSSeq.prototype.init = function() {
if (!document.getElementById || !document.getElementsByTagName || !document.getElementsByName ||
!(window.XMLHttpRequest || (window.ActiveXObject && !bEnv.MacIE))) return;
this._preloadImages();
this.buildControls(); // if HTML handled in peices
this.updateSlide(0);
if (this._ppState == 1) this.play();
};

TSSeq.prototype._preloadImages = function() {
for (var i = this.data.co.length-1; i >= 0; i--) {
this.slideImages[i] = new Image();
this.slideImages[i].src = this.data.co[i].img.imgSrc;
this.slideThumbs[i] = new Image();
this.slideThumbs[i].src = this.data.co[i].thumb.imgSrc;
}

this._ppBtn[0] = new Image();
this._ppBtn[0].src = "onthescene/play.gif";
this._ppBtn[1] = new Image();
this._ppBtn[1].src = "onthescene/pause.gif";
};

/* create controls; back, play/pause, next, button per slide */
TSSeq.prototype.buildControls = function() {
// Add event listeners
Events.addEvent(document.getElementById("backControl"), "click", self.back, false);
Events.addEvent(document.getElementById("playControl"), "click", self.playpause, false);
Events.addEvent(document.getElementById("nextControl"), "click", self.next, false);

Events.addEvent(document.getElementById("thumbLink0"), "click", self.slideOne, false);
Events.addEvent(document.getElementById("thumbLink1"), "click", self.slideTwo, false);
Events.addEvent(document.getElementById("thumbLink2"), "click", self.slideThree, false);
Events.addEvent(document.getElementById("thumbLink3"), "click", self.slideFour, false);

};

TSSeq.prototype.updateSlide = function(s) {
document.getElementById("img").src = this.slideImages[s].src;
document.getElementById("img").alt = this.data.co[s].img.imgAlt;

if(this.data.co[s].link!="") {
document.getElementById("imgA").href = this.data.co[s].link;
document.getElementById("imgA").title = this.data.co[s].img.imgAlt;
} else {
document.getElementById("imgA").removeAttribute("href");
document.getElementById("imgA").removeAttribute("title");
}

document.getElementById("headlineLink").innerHTML = this.data.co[s].headline;

if(this.data.co[s].link!='') document.getElementById("headlineLink").href = this.data.co[s].link;
else document.getElementById("headlineLink").removeAttribute("href");

document.getElementById("teaser").innerHTML = this.data.co[s].teaser;

var j = 0;
var count = s;
while (j < 4) {
document.getElementById("thumbImg"+j).src = this.slideThumbs[j].src;
document.getElementById("thumbImg"+j).alt = this.data.co[j].img.imgAlt;
//document.getElementById("thumbLink"+j).href = this.data.co[j].link;
document.getElementById("thumbsport"+j).innerHTML = this.data.co[j].sport;

if (count < this.data.co.length-1) {
count += 1;
} else {
count = 0;
}
j += 1;
}

j = 0;
while (j < 4) {
if (j == s) {
document.getElementById("thumbLink"+j).className = "currentstory";
} else {
document.getElementById("thumbLink"+j).className = "otherstory";
}
j += 1;
}
};

// show current slide
TSSeq.prototype.showSlide = function(s) {
this.pause();
if (s == this.currentslide) {
return;
} else {
this.currentslide = s;
this.updateSlide(s);
}
};

// play/pause toggle
TSSeq.prototype.playpause = function() {
self._ppState = self._ppState == 0 ? 1 : 0;
self._ppState == 1 ? self.play() : self.pause();
document.getElementById("playImg").src = self._ppBtn[self._ppState].src;
};

// external trigger to autoplay
TSSeq.prototype.playOnCommand = function() {
self._ppState = 0; // make certain it is paused
self.playpause();
};

// next/auto advance
TSSeq.prototype.advanceSlide = function() {
self.currentslide++;
if (self.currentslide > self.data.co.length-1) self.currentslide = 0;
self.updateSlide(self.currentslide);
};

// slide 1
TSSeq.prototype.slideOne = function() {
self.pause();
self.currentslide = 0;
self.updateSlide(self.currentslide);
};

// slide 2
TSSeq.prototype.slideTwo = function() {
self.pause();
self.currentslide = 1;
self.updateSlide(self.currentslide);
};

// slide 3
TSSeq.prototype.slideThree = function() {
self.pause();
self.currentslide = 2;
self.updateSlide(self.currentslide);
};

// slide 4
TSSeq.prototype.slideFour = function() {
self.pause();
self.currentslide = 3;
self.updateSlide(self.currentslide);
};

// set current slide to previous
TSSeq.prototype.next = function() {
self.pause();
self.advanceSlide();
};

// set interval to run function
TSSeq.prototype.play = function() {
if (this._ppState == 1) {
this._intervalId = setInterval(function() { self.advanceSlide(); }, 1000*this.timeout);
}
};

// stop countdown(?)
TSSeq.prototype.pause = function() {
this.abortCountdown();
document.getElementById("playImg").src = self._ppBtn[self._ppState].src;
};

// set current slide to next
TSSeq.prototype.back = function() {
self.pause();
self.currentslide--;
if (self.currentslide < 0) self.currentslide = self.data.co.length-1;
self.updateSlide(self.currentslide);
};

TSSeq.prototype.abortCountdown = function() {
this._ppState = 0; // reset ppState
clearInterval(this._intervalId);
this.count = this.data.timeout; // reset count
};

TSSeq.prototype.toString = function() {
return "TSSeq object";
}

/* Set flag so methods aren't redefined */
TSSeq._initialized = true;
}
}

Thanks for any help!