Birthday Popup

Discussion in 'HTML & Website Design' started by spikehackerinc, Nov 24, 2007.

0
  1. #1
    Hey there guys, I'm making myself a personal little page... But I have run into a little problem... What I'm trying to do is make a birthday popup page.

    In other words, I want to have a list on names and dates maybe in a text file or in the actual html file. So when the date comes up, it shows the name and message at the bottom of the page...

    So for example... in the text file or html.

    Joe, 1985,09,24
    Tom, 1946,05,15
    Carry, 1968,12,02

    So on the 24th of September of the current year (2007) on the bottom of the page there is a message saying "Happy Birthday!!! Joe" maybe even the age next to that.

    I'v tried searching but can't find anything that actually works... I really hope some one on this site can help...

    Thanks alot and lookin forward to your solution. :eek:
     
    spikehackerinc, Nov 24, 2007 IP
  2. joebert

    joebert Well-Known Member

    Messages:
    2,150
    Likes Received:
    88
    Best Answers:
    0
    Trophy Points:
    145
    #2
    If it's just for a personal page & a group of friends, family, or somthing, it's probably going to be easiest to use Javascript.

    For instance the JS would look like this.
    I'm sure you can see how to manage the birthdays at the top, just add or remove "birthdays[#]" lines as needed.
    var birthdays = new Array();
birthdays[0] = {name:"Joebert", day:24, month:11, year:1968};
birthdays[1] = {name:"Jen", day:24, month:11};
birthdays[2] = {name:"Bill", day:12, month:11, year:1964};

var message = "";
var today = new Date();
today = {day:today.getDate(), month:today.getMonth()+1, year:today.getFullYear()};
for(var i=0; i<birthdays.length; i++){
	if(!birthdays[i]){continue;}// Don't break if a birthday is removed, & don't require re-ordering
	if(birthdays[i].day == today.day && birthdays[i].month == today.month){
		message += ", " + birthdays[i].name + "(" + (birthdays[i].year ? (today.year - birthdays[i].year) : 'secret') + ")";
	}
}
if(message != ""){
	document.writeln("<b>Happy Birthday to</b>" + message);
}
    Code (markup):
    Then, you would place that script wherever you wanted the output displayed on the page.

    <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
<title>Untitled Document</title>
<style type="text/css">

</style>
</head>

<body>
<script type="text/javascript">
var birthdays = new Array();
birthdays[0] = {name:"Joebert", day:24, month:11, year:1968};
birthdays[1] = {name:"Jen", day:24, month:11};
birthdays[2] = {name:"Bill", day:12, month:11, year:1964};

var message = "";
var today = new Date();
today = {day:today.getDate(), month:today.getMonth()+1, year:today.getFullYear()};
for(var i=0; i<birthdays.length; i++){
	if(!birthdays[i]){continue;}// Don't break if a birthday is removed, & don't require re-ordering
	if(birthdays[i].day == today.day && birthdays[i].month == today.month){
		message += ", " + birthdays[i].name + "(" + (birthdays[i].year ? (today.year - birthdays[i].year) : 'secret') + ")";
	}
}
if(message != ""){
	document.writeln("<b>Happy Birthday to</b>" + message);
}
</script>
</body>
</html>
    Code (markup):
     
    joebert, Nov 24, 2007 IP
  3. spikehackerinc

    spikehackerinc Peon

    Messages:
    3
    Likes Received:
    0
    Best Answers:
    0
    Trophy Points:
    0
    #3
    Thank alot joebert... That was a FAST and ACCURATE solution... And simple :D

    Thanks again... worked perfect, just gonna tweak it a bit ;) I had something similar but yours is by far better!!!

    :D
     
    spikehackerinc, Nov 24, 2007 IP