Next Prev

SlideShow Alternative

Read more and download "SlideShow Alternative"

If you just want to simply rotate images with some accompanying links, and you want to do it on the cheap, this is a possible alternative.
It sure beats using animated GIF images, like the ones seen on the Billy Graham website.
The trouble with GIFs is limited color depth, choppy transitions, and ability to only put one link despite multiple frames, not to mention having to re-create the file if you want to splice in new images.

Visit PhpDaddy.com

Play with this script by changing the html bellow. Submit your changes by clicking on this bar. Refresh the page to reset changes.

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd">
<html xmlns="http://www.w3.org/1999/xhtml" xml:lang="en">
<head>
<base href="http://www.ajaxdaddy.com/web20/slideshow-alternative/">
      <style type="text/css">
        body {color: white;background: #52616F;} 
        a {  color: white; }
      </style>
<meta http-equiv="content-type" content="text/html; charset=utf-8" />
<meta http-equiv="imagetoolbar" content="false" />
<link rel="stylesheet" href='css/slideshow.css' type="text/css" />

<title>Slideshow Demo</title>
</head>
<body  style="background: orange;">

<center>
<div id="rotator">
	<a href="http://9rules.com/"><img src="images/9rules.jpg" alt="9rules Network" /></a>
	<a href="http://cssbeauty.com/"><img src="images/cssbeauty.jpg" alt="CSS Beauty" /></a>
	<a href="http://godbit.com/"><img src="images/godbit.jpg" alt="Godbit Project" /></a>
	<a href="http://stylegala.com/"><img src="images/stylegala.jpg" alt="Stylegala" /></a>
	<a href="http://yahoo.com/"><img src="images/yahoo.jpg" alt="Yahoo!" /></a>
</div>
<p>
	<a href="http://sonspring.com/journal/slideshow-alternative">What is this?</a>
</p>
</center>
<script type="text/javascript" src="javascript/xfade2.js"></script>
</body>
</html>

Play with this script by changing the html above. Submit your changes by clicking on this bar. Refresh the page to reset changes.

Comment on this example

Ian Walter

2007-09-28 07:52:34

This would be perfect if it had a little numbered navigation at the top for each slide, IE: 1, 2, 3, 4, 5 and you could click on the number to go to that slide.

Welcome to AjaxDaddy.com

A large collection of nifty web 2.0 demos

SlideShow Alternative

Comment on this example