Categories:

Home / Free JavaScripts / Image Slideshows & Galleries / Here

Cut & Paste Random Transitions Slideshow

Credit: JavaScript Kit

Description: This is an image plus text description slideshow that brings each image into view using 1 of 17 randomly chosen Transitional effects in IE browsers. For other browsers that don't support these built in effects, a custom fade transition is used instead. Each image can be optionally hyperlinked with a text description beneath it, and the slideshow pauses when the user moves the mouse over it. When it comes to transitions, the more the merrier!

Examples:

Directions

Step 1: Add the below into the <HEAD> of your page:

You should download the below .js file, which the code above references:

transitionshow.js

Step 2: Where you wish the slideshow to appear inside the BODY, add the following sample invocation code:

Make sure the property "wrapperid" is set to an arbitrary but unique string for each instance of the slideshow on your page. The images you wish to show are defined within the array "imagearray":

imagearray: [
 ["summer.jpg", "http://en.wikipedia.org/wiki/Summer", "_new", "Such a nice Summer getaway."],
 ["winter.jpg", "http://en.wikipedia.org/wiki/Winter", "", "Winter is nice, as long as there's snow right?"],
 ["spring.jpg", "", "", "Flowers spring back to life in Spring."],
 ["autumn.jpg", "", "", "Ah the cool breeze of autumn."]
],

where each image is specified with the following settings:

 ["image_path", "optional_image_link", "optional_link_target", "optional_text_description],


JavaScript Tools:
Site Info

CopyRight 1998-2012 JavaScript Kit. NO PART may be reproduced without author's permission.