View Full Version : Swiss Army Button relocation

04-08-2007, 12:16 AM

1) Script Title: Swiss Army Slideshow

2) Script URL (on DD): http://www.dynamicdrive.com/dynamici...army/index.htm

Is there a way to move the buttons for the three different routines?

I want to move the buttons for the first routine down one more line.

I want to move the buttons of the second routine to below the text and counter of the second.


If we want to use different buttons can this be done? I have graphics I want to use.


04-08-2007, 02:11 PM
Style would be one avenue. The buttons are input elements. So, if you were to do this in your markup:

<div id="show2">
<script type="text/javascript">
new inter_slide(slides2)

You could have this in your stylesheet:

#show2 input {

That would move the buttons down 10 pixels. Any valid style property/value pairs may be used. It all depends upon what you want to do. Be sure to remove any of the styles from the demo page that you do not want. All styles are optional.

Now, the position of the buttons is controlled somewhat as well by the array properties (from the demo page code Step 1):

. . .
var slides2=[]; //SECOND SLIDESHOW
//configure the below images and descriptions to your own.
slides2[0] = ["photo6.jpg", "Crucifix"];
slides2[1] = ["photo7.jpg", "Alter Boys"];
slides2[2] = ["photo8.jpg", "Young Pan"];
slides2[3] = ["photo9_thumb.jpg", "Mona Lisa"];
//optional properties for these images:
slides2.desc_prefix='<b>Description:<\/b> '; //string prefix for image descriptions display
slides2.controls_top=1; //use for top controls
slides2.counter=1; //use to show image count
slides2.width=140; //use to set width of widest image if dimensions vary
slides2.height=225; //use to set he . . .

It is the red highlighted array property that makes the second show's controls be on top. Just remove it, and they will be on the bottom.

For detailed information on the array properties, read the section on the demo page Configuration Options - including the text above and below the table that lists the properties and what they do. To use any given property, place it in the:

//optional properties for these images:

section below the array it is to be applied to and preface it with the array name as shown in the demo code.