View Full Version : Automated Changing Text and Backgrounds

03-13-2005, 02:07 AM
I wasn't sure what to title this and it won't be easy to put in words.

What it's about is the banner ads I've created with text because Norton and other software is stopping banner ad graphics from appearing on the page more and more often now. (Actually this whole matter came up because my pages are created entirely with JavaScript and when I put banner ad graphics on them Norton crashed them. So I've reverted to text.)

Anyway, my question is... is there a way to make a banner with HTML and table code and, obviously, JavaScript, and have the contents change. For example, when the banner first appears it might flash Free Trial a couple times then settle down so as not to be annoying.

I know you can create timers with JS and so I could call a function at certain times. But the only way I can think to do this would be to re-write the page each time I want the banner to change. And I don't want to re-write the whole page... just the banner.

I could also do it using Frames and just re-write a single frame containing the banner, but I don't want to divide up the page that way.

I also don't want to use FLASH.

What I want is probably either impossible, or done all the time and I just need to be pointed in the right direction.

Thanks, Peter

03-13-2005, 05:17 AM
If you know how timers work, this should be quite easy:

You have, say, a <p> with 'free trial' written in it.
onload, start your function.
It changes the text to '' (nothing) after 1 second.
It then waits another second and changes it back to 'free trial'.
It repeats that 3 times or as many as you like.



<p id='banner'>Free Trial</p>


function bannerBlink(){

for(var i=0;i<3;i++){
timer that times out 1 seconds;
banner.innerHTML=''; //nothing
timer that waits 1 second;
banner.innerHTML='Free Trial';

or something like that. Does this make sence?

03-13-2005, 06:51 AM
Thanks very much. Never used "for" before (used "while") but I looked it up and that's easy to undertand. Never used ID before and I can't get it to recognize it... I always get the error message "freeTrial" is undefined.

Maybe I can't put ID in a table?

First I tried it here:

b1+="</td></tr><tr><td align=center valign=top id='freeTrial' class='bannerSubText'>";

Then as you see it in the full table here inside a <p> as you suggested:

// Whatever banner
b1="<tr><td align=center>";
b1+="<table width=500 bgcolor='#000000' cellpadding=2 cellspacing=0 align=center onClick='top.location.href=\"whatever.html\"' onMouseOver='this.style.cursor=\"pointer\"'><tr><td>";
b1+="<table width=100% bgcolor='#66ff66' cellpadding=1 cellspacing=0><tr><td>";
b1+="<table width=100% bgcolor='#000000' cellpadding=1 cellspacing=0><tr><td>";
b1+="<table width=100% bgcolor='#ccffcc' cellpadding=0 cellspacing=0><tr><td align=center class='bannerText'>";
b1+="First row of text goes here.";
b1+="</td></tr><tr><td align=center valign=top class='bannerSubText'>";
b1+="<p id='freeTrial'>Free trial text goes here.</p>";
b1+="</td></tr><tr><td height=10></td></tr>"

As a test I tried putting alert(freeTrial.innerHTML) in a number of places and always got the error message. It's very complex because b1 is just part of a large page. I tried the alert both after b1 was included in the code being assembled, and after the document.write after the page was created. Nothing worked.

Anyway, I'll sort out this mess another time. But thanks for the great reply, and please let me know if ID can be placed in a table in <td> or wherever.


03-13-2005, 07:03 AM
An id can be placed anywhere. I know what your problem is.
To be applied, this id has to be loaded on the page. The alert you are doing happens before the page has finished loading, You need to start this blinking thing after the loading has finished. so:

<body onload='yourfunction()'>

should work..

To help you further, I would need to see your code.

03-13-2005, 07:31 AM


</head><body onLoad='loaded=true; makeImage()'></body></html>

This is the end of my code. I finish accumulating the code in c then write it into the visible Frame .image.

I can't remember why after the document.write I re-create the page with makeImage() -- I think because I need to be sure something has been completed in another Frame so I do the onLoad -- but it's been working for years.

Thanks so much, Peter

03-14-2005, 12:20 AM
You need this blinking effect to be the very last thing in your function. But I repeat that to help you more, I would need the code. the COMPLETE code. With everything.

03-14-2005, 12:38 AM
It's a half a dozen files (it inserts .js files) for a number of frames and thousands of lines of codes. How would I show you?

Thanks. I'll be on again tomorrow, Peter

03-15-2005, 10:36 PM

I had one of those moments where you're thinking about something totally different... hadn't thought about this for days... and the problem/solution popped into my mind.

When I did my alert(freeTrial.innerHTML) test I forgot I was working in frames and needed alert(parent.frameID.freeTrial.innerHTML).

It worked right away. Now I just need to dig up my old code to time something!

Thanks so much, Peter

03-16-2005, 02:35 AM
I'm happy it turned out okay :)

03-16-2005, 04:52 AM
I guess I need help with a timer. I searched Google and got so many complex ones. I'm surprised there isn't something simple like pause(500).

I tried to create something simple but it didn't work:

function pass(){}

Can you point me in the direction of a simple routing just to pause for some time?

Thanks again, Peter

03-16-2005, 05:04 AM
The timeout or interval way is the best - neither is a 'busy' waiting, which means they don't consume clock cycles while waiting.

Now, what is the code you're trying to run after a delay? If it contains document.write or document.writeln, then that's the problem.

03-16-2005, 05:07 AM
No, it's after the page is all completed. After the page has been displayed on the screen it simply changes the text to make it flash in a banner.

I have it all working but need to time it to slow the flashing down.