Using the Date Object to load an image filie.....

[VisionsIC]

Grettings To All,

This is my first post on here. I am new to Javascript but find it very exciting. I am trying to work with the Date Object to load a particular image according to the current date on the system clock(client-side). My first experiment was successful. With the code shown below, I was able to get an image I specifically named "dg0.jpg" to load to the webpage using the date object. I named these .jpg files as such:

example - 1
-----------------------------------------------------------------------
dg0.jpg
dg1.jpg
dg2.jpg, and so forth.
-----------------------------------------------------------------------

Here is the working code:
-----------------------------------------------------------------------
<script language="Javascript">
document.write('<IMG SRC="dg0.jpg" name="tip" BORDER=0>');
today=new Date();
dateno=today.getDate();
if (document.images)
{document.tip.src="dg"+dateno+".jpg";}
</script>
-----------------------------------------------------------------------
That codes allows to place an image to the webpage based on the current day of the month. Now, I attempted to further experiment by trying to get similar results by not only the days in the month, but also the months too. I figured if Javascript determines the right thing to do with the name of the image file hypothetically like this:

example - 2
-----------------------------------------------------------------------
dg0.jpg ("dg" + "0" + ".jpg")

"dg" (prefix name)
"0" (number used by the date object to determine the proper image to pull according to the current day)
".jpg" (to place the correct image type)
-----------------------------------------------------------------------

If this is true, I tried the same approach with adding the month:

example - 3
-----------------------------------------------------------------------
dg0_8.jpg ("dg" + "0" + "_" + "8" + ".jpg")

"dg" (prefix name)
"0" (number used by the date object to determine the proper image to pull according to the current day)
"_" (an underscore used as a seperator name)
"8" (number used by the date object to determine the proper image to pull according to the current month)
".jpg" (to place the correct image type)
-----------------------------------------------------------------------

Here is the incorrect code I wrote for the above "example - 3".
-----------------------------------------------------------------------
<script language="Javascript">
document.write('<IMG SRC="dg0_8.jpg" name="tip" name="gap" BORDER=0>');
today=new Date();
dateno=today.getDate();
monthno=getMonth();
if (document.images)
{document.tip.src="dg"+dateno+.gap.src="_"+monthno+".jpg";}
</script>
-----------------------------------------------------------------------

Can this be corrected to function properly? I am very open for suggestions...

Aaron (VisionsIC)

[Basscyst]

Welcome here,

I see what you are trying to do, but you have not really described what your problem is. What errors are you getting? What is happening that is unexpected?

Basscyst

[Roy Sinclair]

<script language="Javascript">
document.write('<IMG SRC="dg0_8.jpg" name="tip" name="gap" BORDER=0>');
today=new Date();
dateno=today.getDate();
monthno=getMonth();
if (document.images)
{document.tip.src="dg"+dateno+.gap.src="_"+monthno+".jpg";}
</script>


You have TWO "name" properties for that image, the correct number of name properties is zero since you should be using the "id" property instead. Then your value setting statement also seems to try to set both at once as well, fix those problems and you should be good to go.

[VisionsIC]

Thank you Roy :-)

But, that's just it, I don't know how to correctly code it, I figured that is where the errors with the code are, but I don't know how to properly code it to work :-(

Are you willing to show me?

Aaron

[glenngv]

<script type="text/javascript">
var today=new Date();
var imgSrc = "dg" + today.getDate() + "_" + (today.getMonth()+1) + ".jpg";
document.write('<img src="' + imgSrc + '" name="tip" />');
</script>

getDate() - starts with 1 not 0 (1 to 31)
getMonth() - zero-based month (0=January, December=11)

[VisionsIC]

Thank you so much Glen!! I suppose you'd know how to adjust the code accordingly with text too?

I have the following code that goes with those image files you helped with. I was stuck on how to make Getmonth function with the Date Object.......

Code
-------------------------------------------------------------------------

<script language="Javascript">

quote=new Array();

quote[0]="Christina is 22 years old, 5 foot 6 inches, and works as a retail clerk.";
quote[1]="Carmen is 37 years old, 5 foot 7 inches, and works as an administrative assistant.";
quote[2]="Dana is 26 years old, 5 foot 4 inches, and works as a factory technician.";
quote[3]="Angela is 25 years old, 5 foot 7 inches, and works as a store manager.";
quote[4]="Aiiesha is 27 years old, 5 foot 5 inches, and works as a slot attendant.";
quote[5]="Carmen is 37 years old, 5 foot 7 inches, and works as an administrative assistant.";
quote[6]="Candi is 23 years old, 5 foot 6 inches, and works as a line supervisor.";
quote[7]="Amanda is 24 years old, 5 foot 4 inches, and works as a restaurant hostess.";
quote[8]="Amanda is 33 years old, 5 foot 2 inches, and works as a mummer in a string band.";
quote[9]="Andielynn is 34 years old, 5 foot 5 inches, and works as a senior consultant.";
quote[10]="Dawn is 31 years old, 5 foot 4 inches, and works as a cocktail waitress.";
quote[11]="Christie is 28 years old, 5 foot 3 inches, and works as a beauty technician.";
quote[12]="Ashlee is 21 years old, 5 foot 6 inches, and works as a tattoo artist.";
quote[13]=" Angela is 20 years old, 5 foot 7 inches, and works as a senior cosmotologist.";
quote[14]="Brianna is 19 years old, 5 foot 2 inches, and works as a sales associate.";
quote[15]="Carlye is 29 years old, 5 foot 6 inches, and works as a sales executive.";
quote[16]="Carmen is 21 years old, 5 foot 5 inches, and works as a fashion consultant.";
quote[17]="Carmen is 37 years old, 5 foot 7 inches, and works as an administrative assistant.";
quote[18]="Abbey is 20 years old, 5 foot 0 inches, and works as a massage therapist.";
quote[19]="Carolyn is 30 years old, 5 foot 4 inches, and works as an electrician.";
quote[20]="Cheree is 33 years old, 5 foot 3 inches, and works as a beauty salon ceo.";
quote[21]="Cherie is 27 years old, 5 foot 4 inches, and works as a daycare assistant.";
quote[22]="Christine is 25 years old, 5 foot 4 inches, and works as an adult film actress.";
quote[23]="Carolyn is 30 years old, 5 foot 4 inches, and works as an electrician.";
quote[24]="Ginni is 28 years old, 5 foot 6 inches, and works as a travel associate.";
quote[25]="Joey is 34 years old, 5 foot 2 inches, and works as a financial assistant.";
quote[26]="Jocelyn is 26 years old, 5 foot 0 inches, and works as a jewelry technician.";
quote[27]="Dawn is 27 years old, 5 foot 1 inches, and works as an medical assistant.";
quote[28]="Dayna is 22 years old, 5 foot 8 inches, and works as an adult film producer.";
quote[29]="Emily is 18 years old, 5 foot 6 inches, and works as a data entry clerk.";
quote[30]="Debbie is 37 years old, 5 foot 8 inches, and works as a human resources executive.";
quote[31]="Joey is 34 years old, 5 foot 2 inches, and works as a financial assistant.";

today=new Date();
chosen=today.getDate();
document.write(quote[chosen]);
</script>
------------------------------------------------------------------------

Now, could I just be able to load a similar javascript file for each month like january.js and so on, Whereas, "january.js" is the javascript code above running off of the original javascript code you corrected for me? I understand that I'd have to change the source to point to the .js file instead of an image file numbering it with the same type of number structure to it. How do I go about doing that? If you could assist me that would be greatly appreciated!!! :-)

Aaron (VisionsIC)

[glenngv]

getDate() ranges from 1 to 31 while array index starts with zero. So you have to have an array from 0 to 30 and then adjust the date from getDate() by subtracting 1.

var quote=new Array();

quote[0]="Christina is 22 years old, 5 foot 6 inches, and works as a retail clerk.";
...
quote[30]="Debbie is 37 years old, 5 foot 8 inches, and works as a human resources executive.";

var today=new Date();
document.write(quote[today.getDate()-1]);

Regarding your second question...

var today=new Date();
var arrMonth = new Array("january", "february", "march", "april", "may", "june", "july", "august", "september", "october", "november", "december");

var script = document.createElement("script");
script.setAttribute("type", "text/javascript");
script.setAttribute("src", arrMonth[today.getMonth()] + ".js");
document.getElementsByTagName("head")[0].appendChild(script);