Dynamically Display Text According to the Date

HOME

SCRIPT ARCHIVE

TUTORIALS

SUBMIT A SCRIPT

BOOK STORE

HOME / DATE SCRIPTS / DYNAMICALLY DISPLAY TEXT ACCORDING TO DATE

BUG FIXED!

To keep visitors interested in your site it is necessary to keep it fresh. You can do this by changing the copy or images on your page. You can change them by hand, or use a script to do it automatically.

(If nothing is being displayed, then there is nothing in the date array. You can copy the code, plug in the dates, and it should work.)

This script will place a notice of upcoming events on your page. I used it to display a notice of special weekend events for the White Pines Roller Rink Website. At the end of every month I enter the next month's events into the array and we're good to go. Check out the working example there.

This code goes in between the HEAD tags on your web page:

var today = new Date();
var curdate = today.toLocaleString();

var done = 0

/*CREATE EVENT OBJECTS.  Event properties must follow this format: Title is a text string that is the name of the event. eventDate is a text string used to write the date of the event to the screen. descr is a text string description of the event that is written to the screen.
*/

events = new Array();

var indexmax = 0;

events[0] = new event("Jan 1, 1999", "Jan 3, 1999", "Here\'s something that goes until Jan 3", "Thurs. Jan. 6 at 7:30pm", "Do Something cool on Jan 6th.");

// add more objects above this line

events[99] = new event("Jan 20, 1998", "Jan 1, 1999", "But there are lots of fun events in the works.", "Nothing is on the schedule.", "Please check back soon.");

//The Event Object Constructor
function event(sDate, eDate, title, eventDate, descr) {
	this.sDate = sDate;
	this.eDate = eDate;
	this.title = title;
	this.eventDate = eventDate;
	this.descr = descr;
	this.showEvent = showEvent;
}

var i = 0;

while(done == 0)
{
	if(i > indexmax)
		{
			i = 99;
			done = 1;
		}
		else
		{
		if (Date.parse(curdate) >= Date.parse(events[i].sDate) && Date.parse(curdate) <= Date.parse(events[i].eDate))
			{
			done = 1;
			}
				else
			{
			i++;
			}
		}
}

//The showEvent() Method of the Event Object
function showEvent() {
document.write("<TABLE BORDER=0 BGCOLOR='#FFFFCE' CELLSPACING=2 CELLPADDING=3>");
document.write("<TD WIDTH='300'  HEIGHT='25'>");
document.write("<B><BLINK><FONT COLOR='#FF0000' FACE='verdana, arial, geneva, sans-serif'>Coming Up:  </FONT></BLINK></B>  ");
document.write("<FONT SIZE=3>");
document.write(events[i].eventDate);
document.write("<BR>");
document.write("<B>");
document.write(events[i].title);
document.write("</B>");
document.write("<BR>");
document.write(events[i].descr);
document.write("</FONT>");
document.write("</TD>");
document.write("</TR>");
document.write("</TABLE>");
}

// - End of JavaScript - -->
</SCRIPT>

This code goes in the BODY of your web page where you want your form to be displayed: