Jeepers321
Technical User
I have been trying to adapt this amazing (out of my league) script so that I can add in an way for it to advance to a new webpage at the end of the array.
Would anyone mind please taking a look and helping me in finding a way. I have looked through so many image loop scripts now that I think my brain is in a loop and can't stop.
All I need is a way to run a script from an image map that will loop through a set of images that have been preloaded and at the end of the loop advance the location to a new url. I have seen all of this done in parts but not as a whole.
Thanks
<html>
<head>
<SCRIPT>
function ImageAnimator (imgName, imgURLs, spd) {
this.id = ImageAnimator.cnt;
ImageAnimator.elements[ImageAnimator.cnt++] = this;
this.imgName = imgName;
this.imgURLs = imgURLs;
this.spd = spd ? spd : 500;
this.images = new Array(this.imgURLs.length);
for (var i = 0; i < this.imgURLs.length; i++) {
this.images = new Image();
this.images.src = this.imgURLs;
}
}
function ImageAnimator_play (up) {
if (this.tid)
clearTimeout(this.tid);
this.up = up || typeof up == 'undefined' ? true : false;
if (this.up)
this.cnt = 0;
else
this.cnt--;
if (!this.image)
this.image = document[this.imgName];
if (this.image) {
if (this.up)
this.animateUp();
else
this.animateDown();
}
}
ImageAnimator.prototype.play = ImageAnimator_play;
function ImageAnimator_animateUp () {
this.image.src = this.images[this.cnt].src;
this.cnt++;
if (this.cnt < this.imgURLs.length) {
this.tid = setTimeout('ImageAnimator.elements[' + this.id
+ '].animateUp()', this.spd);
}
else
this.cnt--;
}
ImageAnimator.prototype.animateUp = ImageAnimator_animateUp;
function ImageAnimator_animateDown () {
this.image.src = this.images[this.cnt].src;
this.cnt--;
if (this.cnt >= 0 && this.cnt < this.imgURLs.length) {
this.tid = setTimeout('ImageAnimator.elements[' + this.id
+ '].animateDown()', this.spd);
}
else
this.cnt = 0;
}
ImageAnimator.prototype.animateDown = ImageAnimator_animateDown;
ImageAnimator.cnt = 0;
ImageAnimator.elements = new Array();
</SCRIPT>
<SCRIPT>
var anImageAnimator =
new ImageAnimator (
'anImage',
new Array ('images/Entrance.gif',
'images/EntranceTurn1.gif',
'images/EntranceTurn2.gif',
'images/EntranceTurn3.gif',
'images/EntranceTurn4.gif',
'images/EntranceTurn5.gif',
'images/EntranceTurn6.gif',
'images/EntranceTurn7.gif',
'images/main.gif'),
50
);
</SCRIPT>
<title></title>
<meta name="GENERATOR" content="Microsoft Visual Studio .NET 7.1">
<meta name="vs_targetSchema" content="
</head>
<body bottomMargin="0" leftMargin="0" topMargin="0" rightMargin="0">
<map name="btnMap">
<area href="javascript: void 0" onclick="anImageAnimator.play(true)"
shape="rect" coords="41, 35, 133, 68">
</map>
<IMG NAME="anImage" SRC="images/Entrance.gif" BORDER="0" usemap="#btnMap">
</body>
</html>
Would anyone mind please taking a look and helping me in finding a way. I have looked through so many image loop scripts now that I think my brain is in a loop and can't stop.
All I need is a way to run a script from an image map that will loop through a set of images that have been preloaded and at the end of the loop advance the location to a new url. I have seen all of this done in parts but not as a whole.
Thanks
<html>
<head>
<SCRIPT>
function ImageAnimator (imgName, imgURLs, spd) {
this.id = ImageAnimator.cnt;
ImageAnimator.elements[ImageAnimator.cnt++] = this;
this.imgName = imgName;
this.imgURLs = imgURLs;
this.spd = spd ? spd : 500;
this.images = new Array(this.imgURLs.length);
for (var i = 0; i < this.imgURLs.length; i++) {
this.images = new Image();
this.images.src = this.imgURLs;
}
}
function ImageAnimator_play (up) {
if (this.tid)
clearTimeout(this.tid);
this.up = up || typeof up == 'undefined' ? true : false;
if (this.up)
this.cnt = 0;
else
this.cnt--;
if (!this.image)
this.image = document[this.imgName];
if (this.image) {
if (this.up)
this.animateUp();
else
this.animateDown();
}
}
ImageAnimator.prototype.play = ImageAnimator_play;
function ImageAnimator_animateUp () {
this.image.src = this.images[this.cnt].src;
this.cnt++;
if (this.cnt < this.imgURLs.length) {
this.tid = setTimeout('ImageAnimator.elements[' + this.id
+ '].animateUp()', this.spd);
}
else
this.cnt--;
}
ImageAnimator.prototype.animateUp = ImageAnimator_animateUp;
function ImageAnimator_animateDown () {
this.image.src = this.images[this.cnt].src;
this.cnt--;
if (this.cnt >= 0 && this.cnt < this.imgURLs.length) {
this.tid = setTimeout('ImageAnimator.elements[' + this.id
+ '].animateDown()', this.spd);
}
else
this.cnt = 0;
}
ImageAnimator.prototype.animateDown = ImageAnimator_animateDown;
ImageAnimator.cnt = 0;
ImageAnimator.elements = new Array();
</SCRIPT>
<SCRIPT>
var anImageAnimator =
new ImageAnimator (
'anImage',
new Array ('images/Entrance.gif',
'images/EntranceTurn1.gif',
'images/EntranceTurn2.gif',
'images/EntranceTurn3.gif',
'images/EntranceTurn4.gif',
'images/EntranceTurn5.gif',
'images/EntranceTurn6.gif',
'images/EntranceTurn7.gif',
'images/main.gif'),
50
);
</SCRIPT>
<title></title>
<meta name="GENERATOR" content="Microsoft Visual Studio .NET 7.1">
<meta name="vs_targetSchema" content="
</head>
<body bottomMargin="0" leftMargin="0" topMargin="0" rightMargin="0">
<map name="btnMap">
<area href="javascript: void 0" onclick="anImageAnimator.play(true)"
shape="rect" coords="41, 35, 133, 68">
</map>
<IMG NAME="anImage" SRC="images/Entrance.gif" BORDER="0" usemap="#btnMap">
</body>
</html>
