Javascript error: Obj has no properties

Okay, numero uno. I believe that this could run significantly faster just by moving the curly brace at the end of "if (obj.style){obj=obj.style;}" to encompass the whole of that block. Here is my (differently formatted) version of this solution:
[CODE]function showImg(myShow) {
var loopNum=99;
for (x=1; x<=(loopNum); x++) { //loop 99 times
myImg = "image" + x; //create image name
if (obj=MM_findObj(myImg)) {
if (obj.style){
obj=obj.style;
if (x == myShow) obj.visibility='visible';
else obj.visibility='hidden';
}
}
}
}[/CODE]
My other idea was to go with the document.images idea but modify it so it would have the same functionality. This should be faster because it doesn't have to test every object in the document, just the images. Here it is:
[CODE]function showImg(myShow) {
myImg = "image" + myShow;
var currentImg = document.images;
var i = 0;
while(currentImg[i]) {
if(currentImg[i].name==myImg) currentImg[i].style.visibility="visible";
else currentImg[i].style.visibility="hidden";
i++;
}
}[/CODE]
I believe this second solution should be faster, but I don't have a html page with 60 or so images to test it on, and I can't be bothered to make one. so try them out. It's easy, just copy the script exactly as it is from here and overwrite the current "showImg()" function in your javascript (making sure you've backed up first) and then post here to let me know if they work, and which is better,

Robin.[/QUOTE]

Thanks a lot Robin - this was so much appreciated!

Ok, the results are as follows:

The first solution worked - though not as fast as the original version with the javascript error (but faster than the solution suggested by Orc Scorcher). Anyhow, it is an acceptable speed but quicker would be better.

The second solution did not work; the javascript was set to hide all images on mouseover, and that's exactly what it did do - including the thumbnails! So left with a pretty blank page after first image was clicked on. Maybe there is a way to get the just the main images to hide (CSS styles?).

The conflict with my other javascript slideshow is still apparent. What I will do tomorrow (Tues) is to post a mock site with the two solutions on so that you can see how it works and also to exemplify the javascript conflicts between the thumbnail click to display the main image and the slideshow buttons (forward and back) to display the same images. If a User switches between the two methods, then the correct image gets out of sync.

Maybe a visual example would be better to explain like I said, but here is the rest of the javascript which works the thumbnails (I don't use the fade feature but don't know which lines to delete):


[CODE]var DHTML = (document.getElementById || document.all || document.layers);
if ( !DHTML ) alert('Your browser is not capable of displaying this page');
function getObj(name) {
if (document.getElementById) {
this.obj = document.getElementById(name);
this.style = document.getElementById(name).style;
} else
if (document.all) {
this.obj = document.all[name];
this.style = document.all[name].style;
} else
if (document.layers) {
this.obj = document.layers[name];
this.style = document.layers[name];
}
}

function visib(objName, flag) {
x = new getObj(objName);
x.style.visibility = (flag) ? 'visible' : 'hidden';
}



images = new Array( // The ids of the images generated by php to allow for varying amount of images per page

'image1',
'image2',
'image3','image4');

var fadeOn = false;
function setFade(switchFade) {// Fade switch function
if ( !fadeOn ) {
prepLyr(images[curImg], true);
} else { // No fade
stopFade();
for ( var i = 0; i < 8; i++ ) {
prepLyr(images[i], true);
if ( images[i] != images[curImg] )
visib(images[i], false);
}
}
fadeOn = switchFade;
}

var curImg = 0; // index of the array entry
var lastImg = 0;
function changeSlide ( change ) {
if (!DHTML) return;
curImg += change;
if ( curImg < 0 ) curImg = images.length-1;
else
if ( curImg >= images.length ) curImg = 0;
if ( fadeOn ) {
firstFade = true;
prepLyr(images[lastImg], true );
fadeLayer(images[lastImg], 10, 50);
} else {
visib(images[lastImg], false);
visib(images[curImg], true);
}
lastImg = curImg;
}

var firstFade = true;
function nextFade() {
firstFade = false;
prepLyr(images[curImg], false);
fadeLayer(images[curImg], -10, 50);
}

var clipTop = 0;
var clipWidth = 150;
var clipBottom = 0;
var lyrheight = 0;
var time,amount,theTime,middle;
var imageSize = new Array()

function prepLyr(lyr, vis) {
if (!DHTML) return;
x = new getObj( lyr );
if (document.layers) {
if ( !imageSize[lyr] ) {
lyrheight = x.style.clip.bottom;
clipWidth = x.style.clip.right;
imageSize[lyr] = lyrheight + 'x' + clipWidth;
} else {
lyrheight = parseInt(imageSize[lyr]);
clipWidth = imageSize[lyr].substr(imageSize[lyr].indexOf('x')+1);
}
if ( vis ) {
clipTop = 0;
middle = Math.round(lyrheight/2);
clipBottom = lyrheight;
} else {
middle = Math.round(lyrheight/2);
clipBottom = middle;
clipTop = middle;
}
x.style.clip.top = clipTop;
x.style.clip.left = 0;
x.style.clip.right = clipWidth;
x.style.clip.bottom = clipBottom;
x.style.visibility = 'show';
} else
if (document.getElementById || document.all) {
lyrheight = x.obj.offsetHeight;
clipWidth = x.obj.offsetWidth;
if ( vis ) {
clipTop = 0;
middle = Math.round(lyrheight/2);
clipBottom = lyrheight;
} else {
middle = Math.round(lyrheight/2);
clipBottom = middle;
clipTop = middle;
}
x.style.clip = 'rect('+clipTop+' '+clipWidth+' '+ clipBottom +' 0)';
visib(lyr, true);
}
}

function fadeLayer(layername, amt, tim) {
if (!DHTML) return;
thelayer = new getObj( layername );
if (!thelayer) return;
amount = amt;
theTime = tim;
realFade();
}

function stopFade() {
if (time) clearTimeout(time);
}

function realFade() {
clipTop += amount;
clipBottom -= amount;
if (clipTop < 0 || clipBottom > lyrheight || clipTop > middle) {
if ( clipTop > middle ) thelayer.style.visibility = 'hidden';
if ( firstFade ) nextFade();
return;
}
if (document.getElementById || document.all) {
clipstring = 'rect('+clipTop+' '+clipWidth+' '+clipBottom+' 0)'
thelayer.style.clip = clipstring;
} else
if (document.layers) {
thelayer.style.clip.top = clipTop;
thelayer.style.clip.bottom = clipBottom;
}
time = setTimeout('realFade()',theTime);
}[/CODE]

[COLOR=DarkOrange]As I said, I have now created a working dummy of the web page at treacle sponge dot com /slideshow.php. (I thought it would be prudent to break the URL into words..). Here you will see a visual examples I am having with the javascript conflicts. However you do not see a noticeable issue with the thumbnail display speed as I only posted six images (I can do more if this works).

Please note the conflicts with the two ways of displaying the main images - either by clicking the thumbnail or using the slide show buttons.



I would really appreciate it if you could look at this and get back to me if you can.



Thanks once again.[/COLOR] ?