Forums > Image: Slideshow

Forums > Resource Center > Support Center > Xanga Support > Xanga Resolved Topics

micron

Feb 12 2004, 03:38 AM

PLEASE NOTE THAT THIS SCRIPT NO LONGER WORKS ON XANGA DUE TO THE SETTIMEOUT FUNCTION[

DESCRIPTION: A createBlog.com original - image slideshow with transition effects! Place it where you want your image. Recommended to be used only with images with the same dimensions. Read the directions for more information.

EXAMPLE:

COPY AND PASTE WHERE YOU WANT IMAGE TO APPEAR (REQUIRED 1 OF 1):

CODEBOX: -> right click -> copy/paste

<script type='text/javascript'> // image slideshow by micron // for more xanga scripts and help go to createblog.com // set slideshow speed in seconds var speed = 2; // set transition duration in seconds (only for ie 5.5+) var duration = 1; // set transition effect (only for ie 5.5+) var transition = 'progid:DXImageTransform.Microsoft.Fade(Duration='+duration+')'; var images = new Array(); // url to your images images[0] = 'http://url.to/image1.jpg'; images[1] = 'http://url.to/image2.jpg'; images[2] = 'http://url.to/image3.jpg'; images[3] = 'http://url.to/image4.jpg'; // do not edit anything below this line var preload = new Image(); for (var i = 0; i < images.length; i++) { preload[i] = new Image(); preload[i].src = images[i]; } document.write('<img src='+preload[0].src+' name="slideShow">'); var j = 0; function run() { if (document.all) {  document.images.slideShow.style.filter=transition;  document.images.slideShow.filters[0].Apply(); } document.images.slideShow.src = preload[j++].src; if (document.all) { document.images.slideShow.filters[0].Play(); } if (j == images.length) { j = 0; } setTimeout('run()', speed * 1000); } </script> <body onload='run()'>

TRANSITION EFFECTS
To change your transition effect look for DXImageTransform.Microsoft.Fade in the script above and replace Fade with one of the following: Blinds, Barn, CheckerBoard, GradientWipe, Inset, Iris, Pixelate, RadialWipe, RandomBars, RandomDissolve, Slide, Spiral, Stretch, Strips, Wheel, or ZigZag.

For exmaple, the code insert below (taken from above):

Should look like this (transition set to Inset):

This is a "lo-fi" version of our main content. To view the full version with more information, formatting and images, please click here.