View Full Version : Line Break in Swiss Army Image Slideshow

04-22-2008, 04:47 AM
1) Script Title:

Swiss Army Image Slideshow

2) Script URL (on DD):


3) Describe problem:

No problem the script is awesome one slight alteration needed.

I noticed when I changed the script so I could have a "jump to" in it


It works perfectly but the jump to section is immediately below and could use a line break.

Is this possible?

Also I notice for the third slide show, if you use buttons you can put a "jump to" box, but if you use the images it won't allow the "jump to," is that just the way the script works?

As always thanks

04-22-2008, 03:10 PM
OK, for the first question this is only a little bit tricky. Each slide show on a page has a number. 0 is the first slide show on a page, 1 is the second, 2 is the third, and so on for however many slide shows you have. Now the text input for the jumper and its GO button each have id's. They are 'goto#' and 'go#' respectively. The # is the number of the slideshow. So in the case of the second slide show, they would be 'goto1' and 'go1'. Now, since they are both on the same line, to get them to have a little space above them, only one need be given a top margin. So, in the style section you could have:

#go1 {

That will take care of it for the second slide show on the demo page. I gave you all of that extra information just in case you wanted to do more with them, or to use it to do other things with other jump to controls in other shows.

Now the second question is a bit trickier, as I originally made no provision for a jumpto when image controls are used. You can add that capability to the script by editing swissarmy.js in a text only editor like notepad. Find this (it occurs only once in the script, at the end of a very long line):


Paste this:

'+(this.jumpto? '<tr><td colspan=3>Jump to:'+brs+'<input disabled type="text" size="'+this.imgs.length.toString().length+'" id="goto'+this.issid+'" onkeydown="iss['+this.issid+'].jumper(event);"><input id="go'+this.issid+'" disabled type="button" onclick="iss['+this.issid+'].jumper();" value="GO"><\/td><\/tr>' : '')+'

directly in front of it. When you are done, it should still be just one very long line, just a little longer than before.

Then find this (also found only once in the script):


Change it to:


Once you take care of both of those changes, shows with image controls can have jumpto if they are set with the:



05-12-2008, 04:15 AM
Thanks John for your help, your directions to get the buttons in when you use "jump to" worked perfectly.

I couldn't get your first one to work though, so I guess I am not understanding that. The part abou the add

#go1 {

I put it into my CSS and it didn't seem to do anything, so I guess I am not understanding that.

Anyway I moved to slideshow three. And here's the first question I have for that

Here's some questions I have for the third show, perhaps you can guide me.

When I use the buttons (instead of the images for buttons) the spacing works out great. When I used images I get a an odd thing.

With the buttons generated by the html browser it reads

<< Play >>
Jump to: [_] GO

This is pefect:

When I switch to Images it reads

left image Play right image
Jump to:
[_] GO

And the left image, right image and play image have red borders around them.

I'd like to get rid of the red borders around the images and get the Jump to: Go all on one line.

Is that controlled through the CSS? I played with it a bit but I'm not sure perhaps my own CSS rules are conflicting with this?

Second question I have about the script is again spacing.

When I use descriptions the script puts a space Above and below the description.

It would be nice to have it

<< play >>
Jump To:

With no spaces just on lines one after another. With the spaces above and below the description it makes it very long. Again is this part of the CSS or written into the swissarmy. js I downloaded.

Thanks again for your help

The script is great.