Jump to content

Recommended Posts

I have a 2 functions that I need to load in the body tag. I have read that you should separate them with a semi-colon but this is not working for me:

 

<script>
function cycle()
{
document.banner.src = imgArray[index].src;
index ++;
if (index == 4)
{
	index = 0;
}
setTimeout("cycle()",2000);
return;
} 

function randomSelect()
{
index = Math.floor(Math.random() * 4);
document.banner.src = imgArray[index].src;
setTimeout("randomSelect()",2000);
return;
}
</script>
</head>

<body onLoad="cycle();randomSelect()">

 

Any suggestions? Thanks.

Link to comment
https://forums.phpfreaks.com/topic/71371-solved-multiple-onload-functions/
Share on other sites

Thanks for your reply. I am a PHP person and typically stay away from JS. However, I'm taking a class that requires its use. A textbook uses <BODY onLoad="blahblah">.

 

I have added alerts:

 

function cycle()
{
document.banner.src = imgArray[index].src;
index ++;
if (index == 4)
{
	index = 0;
}
setTimeout("cycle()",2000);
return;

alert ("running cycle")
} 

function randomSelect()
{
index = Math.floor(Math.random() * 4);
document.banner.src = imgArray[index].src;
setTimeout("randomSelect()",2000);
return;

alert ("running randomSelect")
}

 

But, I don't get alerts on page load.

I did the 3rd function that calls both and it still doesn't work.  :-[

 

function functions()
{
function cycle()
{
	document.banner.src = imgArray[index].src;
	index ++;
	if (index == 4)
	{
		index = 0;
	}
	setTimeout("cycle()",2000);
	return;

	alert ("running cycle")
} 

function randomSelect()
{
	index = Math.floor(Math.random() * 4);
	document.banner.src = imgArray[index].src;
	setTimeout("randomSelect()",2100);
	return;

	alert ("running randomSelect")
}
}

</script>
</head>

<body onload="functions()">

Thanks! But that doesn't work either.  :(

 

I have made SOME progress of my own ... although now both are functioning as the second function would.

 

function cycle()
{
document.bannerCycle.src = imgArray[index].src;
index ++;
if (index == 4)
{
	index = 0;
}
setTimeout("cycle()",2000);
return;
} 

function select()
{
index = Math.floor(Math.random() * 4);
document.bannerRandom.src = imgArray[index].src;
setTimeout("select()",2000);
return;
}

<body onLoad="cycle();select()">

<h2>My Cycling Banner</h2>
<img name="bannerCycle" src="images/1.gif">

<h2>My Random Images</h2>
<img name="bannerRandom" src="images/1.gif">

 

try this, i made it an object for better control

 


var banner = {
    imgArry: //place your array here
    ban:    document.getElementById('bannerid'),
    index:  0,
time_limit: 2000,

    select: function(){
        this.index = Math.floor(Math.random() * 4);
        this.ban.src = this.imgArray[this.index].src;
        setTimeout("banner.cycle()",this.time_limit);
        return this;
    },

    cycle: function(){
        this.ban.src = this.imgArray[this.index].src;
        if(++this.index == (this.imgArray.length - 1)) this.index = 0;
        setTimeout("banner.select()",this.time_limit);
        return this;
    }
};

window.onload = banner.select();

 

just looked at this again and cleaned up the code a lot

 

var banner = {
    imgArry: //place your array here
    ban:    document.getElementById('bannerid'),
    index:  0,
    time_limit: 2000,

    start: function(){
        this.index = Math.floor(Math.random() * 4);
        banner.cycle();
    },

    cycle: function(){        
        this.ban.src = this.imgArray[this.index].src;
        if(++this.index == (this.imgArray.length - 1)) this.index = 0;
        setTimeout("banner.cycle()",this.time_limit);
    }
};

window.onload = banner.start();

Thanks for that emehrkay! That would be great in any other case. Like I said, unfortunately, this is for a class so I can't really overhaul the structure and would have to follow the guidelines of the textbook. The script is done exactly as asked - just not functioning as asked.

Thanks for that emehrkay! That would be great in any other case. Like I said, unfortunately, this is for a class so I can't really overhaul the structure and would have to follow the guidelines of the textbook. The script is done exactly as asked - just not functioning as asked.

So where do you stand with your code right now?

Hi again, fenway!

 

<script>
var imgArray = new Array(4);
imgArray[0] = new Image;
imgArray[0].src = "images/1.gif";
imgArray[1] = new Image;
imgArray[1].src = "images/2.gif";
imgArray[2] = new Image;
imgArray[2].src = "images/3.gif";
imgArray[3] = new Image;
imgArray[3].src = "images/4.gif";
var index = 0;

function cycle()
{
document.bannerCycle.src = imgArray[index].src;
index ++;
if (index == 4)
{
	index = 0;
}
setTimeout("cycle()",2000);
return;
} 

function selectRandom()
{
index = Math.floor(Math.random() * 4);
document.bannerRandom.src = imgArray[index].src;
setTimeout("selectRandom()",2000);
return;
}

</script>
</head>

<body onLoad="cycle();selectRandom()">

<center>
<h2>My Cycling Banner</h2>
<img name="bannerCycle" src="images/1.gif">

<h2>My Random Images</h2>
<img name="bannerRandom" src="images/1.gif">

This thread is more than a year old. Please don't revive it unless you have something important to add.

Join the conversation

You can post now and register later. If you have an account, sign in now to post with your account.

Guest
Reply to this topic...

×   Pasted as rich text.   Restore formatting

  Only 75 emoji are allowed.

×   Your link has been automatically embedded.   Display as a link instead

×   Your previous content has been restored.   Clear editor

×   You cannot paste images directly. Upload or insert images from URL.

×
×
  • Create New...

Important Information

We have placed cookies on your device to help make this website better. You can adjust your cookie settings, otherwise we'll assume you're okay to continue.