You will have to implement a Javascript on your HTML page for this to be possible, it's really not that hard if you follow the steps.
On the page you want to add your slideshows implement the following code:
<title>Slideshow</title>
<style type="text/css">
* {
font-family:calibri,arial;
font-size:16pt;
}
div#show {
background-color:#efefe7;
width:400px;
margin:0; padding:2px;
border:1px solid #909090;
}
div#show table input, div#show4 table input {
outline-style:none;
}
</style>
<!--[if IE]>
<style type="text/css">
div#show table td, div#show4 table td {
height:21px;
}
</style>
<![endif]-->
<script src="swissarmy.js" type="text/javascript"></script>
<script src="slideshow.js" type="text/javascript"></script>
</head>
<body style="margin:0; padding:0;">
<div id="show"><script type="text/javascript">new inter_slide(slideShow)</script></div>
</body>
</html>
}
Now you will need to download a file, "the engine" of the script from the developers website, called swissarmy.js.
And the last thing you need to do , and also to edit , create a file name slideshow.js and implement this code:
var preload_ctrl_images=false;
var previmg='left.png';
var stopimg='stop.png';
var playimg='play.png';
var nextimg='right.png';
var slideShow=[];
slideShow[0] = ["yourimage.jpg", "Image name", "http://www.imagelink.com", "_new", "top=250, left=300, width=500, height=300, location, resizable, scrollbars"];
slideShow[1] = ["yourimage2.jpg", "Image name 2"];
slideShow[2] = ["yourimage3.jpg", "Image name 3", "http://www.imagelink.com"];
slideShow[3] = ["yourimage4.jpg", "Image name 4", "http://www.imagelink.com", "_new"];
slideShow[4] = ["yourimage5.jpg", "Image name 5"];
slideShow[5] = ["yourimage6.jpg", "Image name 6", "http://www.imagelink.com", "_new"];
slideShow.no_descriptions=0; //use for no descriptions displayed
slideShow.pause=1; //use for pause onmouseover
slideShow.image_controls=1; //use images for controls
slideShow.button_highlight='#ffcccc'; //onmouseover background-color for image buttons (requires image_controls=1)
slideShow.specs='width=300, height=250' //global specifications for this show's new window(s)
slideShow.random=0; //set a random slide sequence on each page load
slideShow.manual_start=1; //start show in manual mode (stopped)
slideShow.delay=2000; //sets miliseconds delay between slides
slideShow.no_added_linebreaks=1; //use for not adding line breaks in formatting of texts and controls
I know this seems like a lot, but I tried to make it more easier for you to follow. In this last file you can control what your gallery will show, and how.
To add your images to the gallery , simply edit "yourimage.jpg" with the name if your image file and make sure they are in the same directory with the script , next you can set a name for it that will be displayed on the slideshow. To add more slideshows, simply continue and add "slideShow[6]" bellow "slideShow[5]".
Optionally you can add links to your images , but if you don't wish too, just leave the code of the image slideshow like this : slideShow[1] = ["yourimage2.jpg", "Image name 2"]; ,removing any other code.
