Thanks.
Full Version: Image Rotator
Anyone have a random image rotation script? lieing about somewhere that is easy to use? I've done various searches and they dont really come up with anything good.
Thanks.
Thanks.
http://www.zymic.com/forum/index.php?showtopic=2347
First post - same concept, just replace the quotes with image paths and adjust the HTML manipulation to work with an <img> element.
First post - same concept, just replace the quotes with image paths and adjust the HTML manipulation to work with an <img> element.
I just threw this together.
Can you keep the little comment at the top of imageRotator.js please.
The object source:
Example usage:
First argument (in this case is 'placeholder') is the element's id, second is the amount of milliseconds between rotation, which is 1 second in this case.
There's a zip and tarball attached containing a working demo.
Can you keep the little comment at the top of imageRotator.js please.
The object source:
CODE
/*
* Javascript Image Rotator
* @author : Ed Cradock
* @date : 7 January 2008
*
* For all your webdesign needs: visit http://www.zymic.com
*/
var _this;
function imageRotator(viewport, cycleOffset)
{
_this = this;
this.imageStack = new Array;
this.offset = cycleOffset;
var exists = document.getElementById(viewport);
if(!eval(exists))
{
alert('Element ID does not exist.');
}
else
{
this.viewport = viewport;
}
}
imageRotator.prototype.getRandom = function()
{
var random = Math.floor(Math.random() * this.imageStack.length);
return this.imageStack[random];
}
imageRotator.prototype.setViewport = function()
{
document.getElementById(_this.viewport).src = _this.getRandom();
}
imageRotator.prototype.start = function()
{
this.setViewport();
setInterval(function() { _this.setViewport() }, _this.offset);
}
imageRotator.prototype.add = function(imageName)
{
this.imageStack.push(imageName);
}
* Javascript Image Rotator
* @author : Ed Cradock
* @date : 7 January 2008
*
* For all your webdesign needs: visit http://www.zymic.com
*/
var _this;
function imageRotator(viewport, cycleOffset)
{
_this = this;
this.imageStack = new Array;
this.offset = cycleOffset;
var exists = document.getElementById(viewport);
if(!eval(exists))
{
alert('Element ID does not exist.');
}
else
{
this.viewport = viewport;
}
}
imageRotator.prototype.getRandom = function()
{
var random = Math.floor(Math.random() * this.imageStack.length);
return this.imageStack[random];
}
imageRotator.prototype.setViewport = function()
{
document.getElementById(_this.viewport).src = _this.getRandom();
}
imageRotator.prototype.start = function()
{
this.setViewport();
setInterval(function() { _this.setViewport() }, _this.offset);
}
imageRotator.prototype.add = function(imageName)
{
this.imageStack.push(imageName);
}
Example usage:
CODE
<html>
<head>
<script type="text/javascript" src="lib/imageRotator.js"></script>
<script type="text/javascript">
<!--
window.onload = function()
{
rotator = new imageRotator('placeholder', 1000);
rotator.add('images/etch.jpg');
rotator.add('images/lenny.png');
rotator.add('images/snake.jpg');
rotator.start();
}
-->
</script>
</head>
<body>
<img id="placeholder" />
</body>
</html>
<head>
<script type="text/javascript" src="lib/imageRotator.js"></script>
<script type="text/javascript">
<!--
window.onload = function()
{
rotator = new imageRotator('placeholder', 1000);
rotator.add('images/etch.jpg');
rotator.add('images/lenny.png');
rotator.add('images/snake.jpg');
rotator.start();
}
-->
</script>
</head>
<body>
<img id="placeholder" />
</body>
</html>
CODE
rotator = new imageRotator('placeholder', 1000);
First argument (in this case is 'placeholder') is the element's id, second is the amount of milliseconds between rotation, which is 1 second in this case.
There's a zip and tarball attached containing a working demo.
Thanks very much for taking the time to do that! 
try this
http://xbile.clanteam.com/stuff/
http://xbile.clanteam.com/stuff/
QUOTE(Cspace @ Jan 9 2008, 05:19 PM) 
Thanks very much for taking the time to do that!
You're welcome.
These are real good ones I use, also can't rotate same thing twice in a row random rotators
This is a "lo-fi" version of our main content. To view the full version with more information, formatting and images, please click here.