Presentational Slideshow. Displays and rotates images in a "presentational", left right sliding manner. Images can be individually set to be linked or not. Tested in IE5.5, IE6.0, Netscape4.08 and Netscape7.02

"W e got our inspiration for this script from the frontpage of [ MSNBC ] (midpage), where they use a similar device to scroll through pictures. Well, as the name implies, this cool script displays and rotates images in a "presentational", left right sliding manner. Images can be individually set to be linked or not"*.

* The above is a quote from the script site. We cannot take credit for it.

W e have tested the code in IE5.5, IE6, Netscape4.08 and Netscape7.02. This script worked well in all platforms tested with one variation observed in Netscape4.08.

1) Instead of each image sliding in from left to right, the images will just change without the slide-in effect.
2) Does not hamper the operations of this script in any way.

D epending on your knowledge of HTML and java script, this is an easy, one part copy and paste code with reconfigurations on images, links, size attributes, and time between images. You will paste the code anywhere within the <BODY> section you want the effect to appear. Below we will show where the reconfigurations are to be made.

Setting Image Size, Background Color And Time Lag

//Presentational Slideshow Script- By Dynamic Drive
//For full source code and more DHTML scripts,
visit http://www.dynamicdrive.com
//This credit MUST stay intact for legal use

var slideshow_width='100px' //SET SLIDESHOW WIDTH (set to largest
image's width if multiple dimensions exist)
var slideshow_height='100px' //SET SLIDESHOW HEIGHT (set to largest
image's height if multiple dimensions exist)
var pause=3000 //SET PAUSE BETWEEN SLIDE (2000=2 seconds)
var slidebgcolor="white"

Breakdown Of Above

var slideshow_width='100px' //SET SLIDESHOW WIDTH (set to largest
image's width if multiple dimensions exist)
var slideshow_height='100px' //SET SLIDESHOW HEIGHT (set to largest

The above means is that you set the size to the largest image you have within the slideshow.

var pause=3000 //SET PAUSE BETWEEN SLIDE (2000=2 seconds)

The above is actually, self explained. This you set for how many seconds between image change.

var slidebgcolor="white"

The above is for what color you want the background behind the slideshow. Not the background of your page!

Adding Uploaded Images

var dropimages=new Array()
//SET IMAGE PATHS. Extend or contract array as needed
dropimages[0]="Full Path To Image #1"
dropimages[1]="Full Path To Image #2"
dropimages[2]="Full Path To Image #3"

T o add more images here, just follow the pattern and be sure to keep the number sequence in order. See below for next image code:

dropimages[3]="Full Path To Image #4"

Adding Links To Images

var droplinks=new Array()
//SET IMAGE URLs. Use "" if you wish particular image to NOT be linked:
droplinks[0]="URL Goes Here"
droplinks[1]=""
droplinks[2]="URL Goes Here"

////NO need to edit beyond here/////////////

T o add more links (URL's) here, just follow the pattern and be sure to keep the number sequence in order. See below for next URL code:

droplinks[3]="URL Goes Here"

Important Note!

T he number of images MUST be the same as the number of link codes, linked or not. In other words, if you have 6 images you must have 6 link code parts of the code.

T o answer your anticipated question, the answer is "No", the links cannot be configured to open in a new browser window.

I f you notice in our slideshow, we have text on the right side of the effect telling you what images are linked. This is not part of the script. We did this by the use of side by side tables. Grab the below link and you will see the howto code for the tables.
[ Side By Side Table Code ]

I f you would like to add this effect into your pages, just grab the below link and you are there. If you have any problems with this, feel free to contact us.
[ Get Code Here ]

Search Our Site By Individual letter

[ A ] [ B ] [ C ] [ D ] [ E ] [ F ] [ G ] [ H ] [ I ] [ J-K ] [ L ]
[ M ] [ N-O ] [ P-Q ] [ R ] [ S ] [ T ] [ U-V ] [ W ] [ X-Y-Z ]

Little Tips Directory

[ Page 1 ] [ Page 2 ] [ Page 3 ] [ Page 4 ] [ Page 5 ] [ Page 6 ] [ Page 7 ]

[ Index Page 1 ] [ Index Page 2 ] [ Index Page 3 ] [ Index Page 4 ] [ Index Page 5 ]
[ Index Page 6 ] [ Index Page 7 ] [ Index Page 8 ] [ Index Page 9 ] [ Index Page 10 ]
[ Index Page 11 ] [ Index Page 12 ] [ Index Page 13 ]

[ News Letter Archives ] [ Navigation Page ] [ Archives Of Published Material ]
[ Link To Us ] [ Alphabet Index ] [ Feedback ] [ On Line Support ] [ FAQ ]
[ Webmaster Utilities ] [ Casino ] [ Banner Exchange ] [ Advanced Site Search ]

If you are part of the ever growing number of webmasters who enjoy sharing your knowledge with others on web design, join The Consigliere Ltd. web ring to broaden your scope of exposure.
Join Today

This Site Was Built And Is Maintained Exclusively by
The Webmaster @ Consigliere Ltd.