Loads all images in a specified directory and creates a slide show

Current Version: 0.9

Github Page: https://github.com/justinwhall/directorySlider

About

I occasionally work on an application that is, for all intent and purposes, a CMS. This application and its subsequent ‘sites’ all use the same exact markup. There is some flexibility with some custom fields, but for reasons not relavant to this post, I wanted a jQuery slide show that:

1) Adds all images from a specified directory.
2) Could be called like so $(‘class-or-id’).directorySlider({object:options});

And thus, the Directory Slider was born…

How to use?

Step 1: Link required files

[html]
<!– jQuery library (served from Google) –>
<script src="//ajax.googleapis.com/ajax/libs/jquery/1.8.2/jquery.min.js"></script>
<!– directorySlider Javascript file –>
<script src="/js/directorySlider.js"></script>
[/html]

Step 2: Create HTML markup

[html]<div class="directorySlider"></div>[/html]

Step 3: Call Directory Slider

[javascript]
$(document).ready(function(){
$(‘.directorySlider’).directorySlider();
});
[/javascript]

Configuration Options

animation Type of Animation.

default: 'fade'
options: 'fade', 'uncover'

filebase Type base of all files in you directoy. Ex: for files slide_01.jpg, slide_02.jpg and slide_03.jpg the filebase would be ‘slide_’ and for img_01.png, img_02.png and img_03.png the filebase would be ‘img_’.

default: 'slide_'
options: string

extension The file extension of the files you are using.

default: 'jpg'
options: any image format (string)

directory The directory of your slides.

default: null
options: '/path/to/slides/folder'

numslides Number of slides in directory.

default: null
options: integer

Optional Options

speed Slide transition speed in milliseconds.

default: 1000
options: integer

timeout Time between slides.

default: 4000
options: integer

height Height of your slideshow in pixels.

default: null
options: integer

width Width of your slideshow in pixels.

default: null
options: integer
 

IMPORTANT PLEASE READ:

If you are seeking support or have any question at all in regards to this script, please provide a LIVE URL otherwise there is just no way to provide helpful feedback. Support questions here via email or on github without a live URL will be ignored. Sorry.