PDA

Click to See Complete Forum and Search --> : Background Image

Roosterman3000
05-07-2003, 01:02 PM
Hi again this was another class assignment that I want to fix.
I am not sure if its all done correctly but we were to post the current date and then we were to count the days left to Christmas. I have that much done at least what the book shows but I want to add a background image rather than have the back ground white. also I am not sure how to change the font color inside of the box. as i said i just finished it right now i am a beginner as far as JS so bare with me as most of you have already thanks again.
Here Is what I have so far.......


<html>
<head>
<script language="javascript">
<!--Hide from non-javascript browsers
function XmasDays(CurrentDay) {
var XYear=CurrentDay.getFullYear();
var XDay=new Date("December, 25, 2003");
XDay.setFullYear(XYear);
var DayCount=(XDay-CurrentDay)/(1000*60*60*24);
DayCount=Math.round(DayCount);
return DayCount;
}

function Daytxt(Daynumber) {
var Day=new Array();
Day[1]="Sunday";
Day[2]="Monday";
Day[3]="Tuesday";
Day[4]="Wednesday";
Day[5]="Thursday";
Day[6]="Friday";
Day[7]="Saturday";
return Day[Daynumber];
}

function Monthtxt(Monthnumber) {
var Month=new Array();
Month[1]="January";
Month[2]="February";
Month[3]="March";
Month[4]="April";
Month[5]="May";
Month[6]="June";
Month[7]="July";
Month[8]="August";
Month[9]="September";
Month[10]="October";
Month[11]="November";
Month[12]="December";
return Month[Monthnumber];
}

// stop hiding -->
</script>
</head>
<body>
<table border="0" width="35%" bgcolor="#FFFFFF" align="center">
<tr>
<td id="daycell" style="color:"Blue">
<p align="center">
<script language="javascript">
<!--Hide from non-javascript browsers

var Today=new Date();
var thisDay=Today.getDate();
var thisMonth=Today.getMonth()+1;
var thisYear=Today.getFullYear();
var Dayout=Today.getDay()+1;

var Daysleft=XmasDays(Today);
var Dayname=Daytxt(Dayout);
var Monthname=Monthtxt(thisMonth);

document.write("The Date Today Is : "+Dayname+" "+Monthname+" "+thisDay+", "+thisYear+"<br>");
document.write("There are "+Daysleft+" days until Christmas!");

//stop hiding-->
</script>
</p>
</td>
</table>
</body>
</html>
cmelnick
05-07-2003, 01:43 PM
The color for the <td> should be <td style="color: blue;"> not <td style="color: "blue"> You have an extra quote mark in there.

As far as a background image, in between your <head> and </head> tags, you should add:

<style type="text/css">
body { background: url("http://yourpic.jpg"); }
</style>
Roosterman3000
05-07-2003, 02:01 PM
sorry about that I didn't even see that the book had the same thing as you did and i just copied wrong. As for the <Style> tag I didn't show it because i added it in later but i use a style sheet already. However, the background of the date and the days till xmas still show up as white instead of the background that i have chosen through my style sheet. I want to get both of the backgrounds the same if it helps the picture is called background3.jpg. shouldn't make not difference if you have the name, but thought i would throw it in anyways. and thank you for pointing out my mistake i appreciate it.


Rooster
Charles
05-07-2003, 02:13 PM
You are making things way more difficult than you need to. There is a reason that Date.getMonth() seems to be off by one - the first index of an anonymous array is zero.

<script type="text/javascript">
<!--
Date.prototype.toString = function () {return [['Sunday,', 'Monday,', 'Tuesday,', 'Wednesday,', 'Thursday,', 'Friday,', 'Saturday,'] [this.getDay()], this.getDate(), ['January', 'February', 'March', 'April', 'May', 'June', 'July', 'August', 'September', 'October', 'November', 'December'] [this.getMonth()], this.getFullYear()].join('&nbsp;')}

Date.ONE_SECOND = 1000;
Date.ONE_MINUTE = Date.ONE_SECOND * 60;
Date.ONE_HOUR = Date.ONE_MINUTE * 60;
Date.ONE_DAY = Date.ONE_HOUR * 24;

var today = new Date();

document.write('Today is ', today, '<br>');
document.write(Math.floor((new Date(today.getFullYear(), 11, 25).getTime() - today.getTime()) / Date.ONE_DAY), ' days until Christmas of this year.');

// -->
</script>