JavaScript Slideshow With Auto File Loading
The JavaScript code used on this page uses the same JavaScript as the first slideshow, but it uses a PHP script to generate the JavaScript that uses the file names of all of the image files it finds in the selected directory. The default directory name is "slides", but you can select any directory without having to edit the code itself. And, yes, this is compatible with the slideshow script that allows multiple slideshows on a page. So all you have to do is put your slide image files in a single, dedicated directory and point the PHP script to that directory in the <script> tag.
You can use the PHP code to replace the "slideshow_init.js" file with either version of the slideshow JavaScript. To select a different directory, just replace "?dir=dirname" in the <script> tag to reflect the name of the directory containing your image files. With a bit of extra code, you could control the order in which the slides are shown. The slides are currently sorted alphabetically by file name, which means that you can control the order in which they appear by modifying the file names.
This code also supports optional titles or captions. Just create a text file named "titles.txt" in the same directory the holds the images for your slideshow. Then for each slide, you enter the file name, followed by a TAB, followed by the title text. This file must be a Unix-compatible text file - that is, a text file that uses a linefeed character (ASCII 10, 0x0Ah) as the line termination character. And be sure to use a backslash ("\") to escape any apostraphe's in your titles. There's a PHP utility program included called showMaker.php that will help you create your slideshows automatically, including setting the titles/captions.
If you are using multiple slideshows on a single page, you need to include a <script> tag calling the slideshow_init.php file for each show, and include the parameter 'showNum', as in:
<script src="slideshow_init.php?dir=slides&showNum=1"></script>
<script src="slideshow_init.php?dir=test&showNum=2"></script>
Then, in the onLoad() function before the call to startShow(), you would add:
show1.loadGallery(gallery1);
show1.loadTitles(titles1);
...
show2.loadGallery(gallery2);
show2.loadTitles(titles2);
All of my JavaScript Slideshow scripts and utilities are included in the package you can download using the button below. My slideshow package is provided free of charge. All I ask is if you use and enjoy my software that you post the following link in an appropriate location on your site:
<a href="https://www.rainbodesign.com/pub/">Rainbo Design's Scripts & Tutorials for Webmasters</a>
This file was last modified on August 27, 2020
