Slideshow with with lamellar effect

Slideshow with with lamellar effect

Slideshow with impressive lamellar transition effect between the pictures. You may add as many pictures and lamellas as you like. Each picture can be linked to a separate URL. Easy 1-minute-configuration of speed, pictures, links and number of lamellas. CROSSBROWSER.

Configuration:

Step 1: Put the file 'imglamellar3.js' and the 3 images the same folder as your webpage.

Step 2: Open your webpage and paste the following code between <body> and </body>:

// CREDITS:
// Slideshow with with lamellar effect
// by Urs Dudli and Peter Gehrig

// CONFIGURATION:
// Go to http://www.24fun.com/fast/index.html and download the script as ZIP-file 
// with step-by-step instructions and copy-and-paste installation.

// your pictures. Add as many pictures a you like.
var picture = new Array()
picture[0]="sample1.jpg"
picture[1]="sample2.jpg"
picture[2]="sample3.jpg"
picture[3]="sample4.jpg"
picture[4]="sample5.jpg"

// links for your pictures. You need as many links as pictures.
// If you don't want to link a picture write '#' instead of an URL (see last sample)
var pictureurl = new Array()
pictureurl[0]="http://www.corbis.com"
pictureurl[1]="http://www.altavista.com"
pictureurl[2]="http://www.corbis.com"
pictureurl[3]="http://www.yahoo.com"
pictureurl[4]="#"

// target of the picture-links (HTML conventions)
var target_url="_blank"
	
// horizontal position of the slideshow (distance to the left margin of the window)
var horizontal_pos=10

// vertical position of the slideshow (distance to the top margin of the window)
var vertical_pos=10

// number of lamellas.
var x_slices=10

// pause beween the pictures (seconds)
var pause=2

// - End of JavaScript - -->
</script>
<script src="imglamellar3.js"></script>

IMPORTANT: Do not paste this code into tables or <DIV> and </DIV> or between any other container!

Step 3: Configure number of lamellas, pictures, speed, links and position of the slideshow inside the script.

Step 4: Paste the following code between <head> and </head>:

Click here to download files