Conveyor Belt Script/Firefox 1st/last image Overlap

[ChristineSG]

1) Script Title: Conveyor Belt Slideshow

2) Script URL (on DD): http://www.dynamicdrive.com/dynamicindex14/leftrightslide.htm

3) Describe problem:
I'm using the script at this address www.ascendant.net/csgtest2


In IE it's fine.
In Firefox (and Netscape for however much that doesn't matter), the last image in the image list is overlapped by the first by 20 or 30 pixels. This is kind of annoying. All of the images are the same height but varying widths. I'm assuming that the problem might be solved by configuring this option in the script:

//Specify gap between each image (use HTML):
var imagegap=" "

I'm not an html novice and certainly I'm not an html genius, but I don't know what to put in there! Or if that is even really the problem.

I put in 10 and I got 10s in between each image :(

I put a bunch of   in but that had no effect at all

I did increase the number of pixels between each slideshow rotaion, but that also had no effect

Anyone have any idea? Thanks in advance!!


Adding: the last image is a tan dog in a red frame, the first is a sunburst face.

[blm126]

Your links are NOT valid.Everywhere you have this


leftrightslide[0]='<img src="images/tnsunburst.jpg" border=0></a>'

It needs to be changed to something like this.


leftrightslide[0]='<a href="#"><img src="images/tnsunburst.jpg" border=0></a>'

Note: # should be replaced with the correct url.(or the links should be removed)
This should fix the problem

[ChristineSG]

Your links are NOT valid.Everywhere you have this


leftrightslide[0]='<img src="images/tnsunburst.jpg" border=0></a>'

It needs to be changed to something like this.


leftrightslide[0]='<a href="#"><img src="images/tnsunburst.jpg" border=0></a>'

Note: # should be replaced with the correct url.(or the links should be removed)
This should fix the problem


I appreciate your response, but not surprisingly I am confused.

Not every image will link to another page.

When I build those pages I will add links back to those particular thumbs.

Why is it invalid to just have img src with no link? Your comment "Or the links should be removed, is what really confuses me." I DID remove the links! :)

[jscheuer1]

Why is it invalid to just have img src with no link? Your comment "Or the links should be removed, is what really confuses me." I DID remove the links! :)

It is not invalid but, if you have kept a trailing </a> on the end as you had, it is. In any case, your page seems fine in FF 1.5.0.6 and NS 7.2 here. I see you 'fixed' the links, you could also remove them entirely:


//Specify the slider's images
var leftrightslide=new Array()
var finalslide=''
leftrightslide[0]='<img src="images/tnsunburst.jpg" border=0>'
leftrightslide[1]='<img src="images/tnkirby.jpg" border=0>'
leftrightslide[2]='<img src="images/tncardinal.jpg" border=0>'
leftrightslide[3]='<img src="images/tnsiamese.jpg" border=0>'
leftrightslide[4]='<img src="images/tntabby.jpg" border=0>'
leftrightslide[5]='<img src="images/tnsammy.jpg" border=0>'
leftrightslide[6]='<img src="images/tnsnowman.jpg" border=0>'
leftrightslide[7]='<img src="images/tnrotties.jpg" border=0>'
leftrightslide[8]='<img src="images/tnleo.jpg" border=0>'
leftrightslide[9]='<img src="images/tnmaya.jpg" border=0>'
leftrightslide[10]='<img src="images/tnruby.jpg" border=0>'
leftrightslide[11]='<img src="images/tnromeo.jpg" border=0>'
leftrightslide[12]='<img src="images/tntommy.jpg" border=0>'
leftrightslide[13]='<img src="images/tnwhite.jpg" border=0>'
leftrightslide[14]='<img src="images/tnjd.jpg" border=0>'
leftrightslide[15]='<img src="images/tnbaby.jpg" border=0>'
leftrightslide[16]='<img src="images/tnvegas.jpg" border=0>'
leftrightslide[17]='<img src="images/tntriscuit.jpg" border=0>'
leftrightslide[18]='<img src="images/tngiraffe.jpg" border=0>'
leftrightslide[19]='<img src="images/tnvictorian.jpg" border=0>'
leftrightslide[20]='<img src="images/tnpelicans.jpg" border=0>'
leftrightslide[21]='<img src="images/tnfish.jpg" border=0>'
leftrightslide[22]='<img src="images/tnsam.jpg" border=0>'