StudioWyld
Programmer
Hello all, I need another set of eyes cause it just isn't working, no matter how identical I make it.
The initRotator function works when called by itself, but when adding another function, only the "other function" works, not the initRotator function.
Here's some examples of what I've tried
1st Example using the 2 functions on body tag:
2nd Example using a script to call both functions, thus using 1 function in body tag instead:
The img name="topright_image" has been tried with out the underscore seperation.
I've also tried the onload function without the ending semi-colon on the end:
The Javascript: dw_rotator.js, Works fine, unless I'm not seeing something.
The initRotator function works when called by itself, but when adding another function, only the "other function" works, not the initRotator function.
Here's some examples of what I've tried
1st Example using the 2 functions on body tag:
Code:
<head>
<script src="css/dw_rotator.js" type="text/javascript"></script>
<script type="text/javascript"><!--
function initRotator() {
// arguments: image name, rotation speed, (optional) path to images
var rotator1 = new dw_Rotator('topright_image', 3400, "/images/");
// add the images to rotate into that image object
rotator1.addImages("main_image7_topright_content.jpg", "main_image2_topright_content.jpg");
// rotator1.rotate(); // sometimes may want to call rotate here
dw_Rotator.start();
}
// --></script>
</head>
<body onload="initRotator();preloadImages()">
<img name="topright_image" src="images/main_image7_topright_content.jpg" height="291" width="404" border="0" alt="">
Code:
<head>
<script src="css/dw_rotator.js" type="text/javascript"></script>
<script type="text/javascript"><!--
function initRotator() {
// arguments: image name, rotation speed, (optional) path to images
var rotator1 = new dw_Rotator('topright_image', 3400, "/images/");
// add the images to rotate into that image object
rotator1.addImages("main_image7_topright_content.jpg", "main_image2_topright_content.jpg");
// rotator1.rotate(); // sometimes may want to call rotate here
dw_Rotator.start();
}
// --></script>
<script type="text/javascript">
function loadtwo() {
initRotator();
preloadImages();
}
</script>
</head>
<body onload="loadtwo()">
<img name="topright_image" src="images/main_image7_topright_content.jpg" height="291" width="404" border="0" alt="">I've also tried the onload function without the ending semi-colon on the end:
Code:
<body onload="initRotator();preloadImages();">
<body onload="initRotator();preloadImages()">
<body onload="preloadImages();initRotator();">
<body onload="preloadImages();initRotator()">
Code:
dw_Rotator.restartDelay = 3400; // delay onmouseout before call to rotate
dw_Rotator.col = [];
// arguments: image name, rotation speed, path to images (optional),
// target, i.e. name of window to direct url's to onclick (optional)
function dw_Rotator(name, speed, path, tgt) {
this.name = name; this.speed = speed || 3400; // default speed of rotation
this.path = path || ""; this.tgt = tgt;
this.ctr = 0; this.timer = 0; this.imgs = []; this.actions = [];
this.index = dw_Rotator.col.length; dw_Rotator.col[this.index] = this;
this.animString = "dw_Rotator.col[" + this.index + "]";
}
dw_Rotator.prototype.addImages = function() { // preloads images
var img;
for (var i=0; arguments[i]; i++) {
img = new Image();
img.src = this.path + arguments[i];
this.imgs[this.imgs.length] = img;
}
}
dw_Rotator.prototype.addActions = function() {
var len = arguments.length; // in case an argument's value is null
for (var i=0; i < len; i++)
this.actions[this.actions.length] = arguments[i];
}
dw_Rotator.prototype.rotate = function() {
clearTimeout(this.timer); this.timer = null;
if (this.ctr < this.imgs.length-1) this.ctr++;
else this.ctr = 0;
var imgObj = document.images[this.name];
if (imgObj) {
imgObj.src = this.imgs[this.ctr].src;
this.timer = setTimeout( this.animString + ".rotate()", this.speed);
}
}
// Start rotation for all instances
dw_Rotator.start = function() {
var len = dw_Rotator.col.length, obj;
for (var i=0; i<len; i++) {
obj = dw_Rotator.col[i];
if (obj && obj.name ) // check for empty instance created by dw_random.js
obj.timer = setTimeout( obj.animString + ".rotate()", obj.speed);
}
}
// called onclick of images
dw_Rotator.doClick = function(n) {
var obj = dw_Rotator.col[n];
if ( !document.images || !obj ) return true;
if ( obj.actions && obj.actions[obj.ctr] ) {
if ( typeof obj.actions[obj.ctr] == "string" ) { // url
if ( obj.tgt ) { // open in separate window
// add features here if you want, i.e., chrome, size, position, ...
var win = window.open(obj.actions[obj.ctr], obj.tgt);
if ( win && !win.closed ) win.focus();
} else {
window.location = obj.actions[obj.ctr];
}
} else { // function pointer
obj.actions[obj.ctr](); // execute function
}
}
return false;
}
// for stopping/starting onmouseover/out
dw_Rotator.pause = function(n) {
dw_Rotator.clearTimers(n);
}
dw_Rotator.clearTimers = function(n) {
var obj = dw_Rotator.col[n];
if ( obj ) {
clearTimeout( obj.timer ); obj.timer = null;
}
}
dw_Rotator.resume = function(n) {
dw_Rotator.clearTimers(n);
var obj = dw_Rotator.col[n];
if ( obj ) {
obj.timer = setTimeout( obj.animString + ".rotate()", dw_Rotator.restartDelay );
}
}