Slider instructions

To use this slider, you'll need to:

• add the js folder from inside this slideshow folder to your project folder
• add the scripts from the header of this file to the header of each page you are going to use a slider in (The commented-out scripts would work as long as you have an internet connection, but since you may be showing your portfolio in places where you may not have a wireless connection, that's not a great idea.)
• copy SLIDESHOW from this file into the body of your page.
• set the img links so they link to your images in your images folder

To prepare your art, I recommend you make your images the same height & width.

If your images are different proportions

First slide sets the size; other images are set to center horizontally and vertically within the space set by the first slide. I've set this slider to take random-size images so you can see what randoom sizes do, but I recommend for a clean look that the slider remain the same height.

Arrows

If you want arrows instead of buttons, remove the commenting from div class="cycle-prev" and div class="cycle-next" and style using .cycle-prev and .cycle-next. Then comment-out the cycle-pager line.

Additional Features

It is possible to include elements that aren't images, but I was having difficulty with this, perhaps because of the cycle-overlay function.

Further Information

For more info, go to: Cycle 2. I recommend donating $5 or $10 to him, as this is a really awesome slider and saves everyone lots and lots of time. And time is money.