Member Avatar

I'm wondering if anyone could help me with this code. I'm trying to display a photo based on the current month.

function pictures(){
document.getElementById('pics');
var m= new Date();
var month=d.getMonth();
switch (month){

case (0):
var img=new Image();
img.src="Holiday/HolidayDesktops/Newyear.jpg";
break;
case(1):
var img=new Image();
img.src="Holiday/HolidayDesktops/Vday.jpg";
break;
case(2):
var img=new Image();
img.src="Holiday/HolidayDesktops/St.Patday.jpg";
break;
case(3):
var img=new Image();
img.src="Holiday/HolidayDesktops/Easter.jpg";
break;
case(4):
var img=new Image();
img.src="Holiday/HolidayDesktops/MemorialDay.jpg";
break;
case(5):
var img=new Image();
img.src="Holiday/HolidayDesktops/NatFlagDay.jpg";
break;
case(6):
var img=new Image();
img.src="Holiday/HolidayDesktops/July4.jpg";
break;
case(7):
var img=new Image();
img.src="Holiday/HolidayDesktops/WomensEqualityDay.jpg";
break;
case(8):
var img=new Image();
img.src="Holiday/HolidayDesktops/LaborDay.jpg";
break;
case(9):
var img=new Image();
img.src="Holiday/HolidayDesktops/Halloween.jpg";
break;
case(10):
var img=new Image();
img.src="Holiday/HolidayDesktops/Thanksgiving.jpg";
break;
case(11):
var img=new Image();
img.src="Holiday/HolidayDesktops/Christmas.jpg";
}

}

<img src="Holiday/HolidayDesktops/July4.jpg" id="pics">

Recommended Answers

<img src="" id="pics">
<script>
var m=new Date();
var imageArray = [
    "Holiday/HolidayDesktops/Newyear.jpg",
    "Holiday/HolidayDesktops/Vday.jpg",
    "Holiday/HolidayDesktops/St.Patday.jpg",
    "Holiday/HolidayDesktops/Easter.jpg",
    "Holiday/HolidayDesktops/MemorialDay.jpg",
    "Holiday/HolidayDesktops/NatFlagDay.jpg",
    "Holiday/HolidayDesktops/July4.jpg",
    "Holiday/HolidayDesktops/WomensEqualityDay.jpg",
    "Holiday/HolidayDesktops/LaborDay.jpg",
    "Holiday/HolidayDesktops/Halloween.jpg",
    "Holiday/HolidayDesktops/Thanksgiving.jpg",
    "Holiday/HolidayDesktops/Christmas.jpg",
];
document.getElementById("pics").src=imageArray[m.getMonth()];
</script>
Jump to Post

Here is another alternative...

If you name your pictures from 0-11 (Jan is 0, Dec is 11), then you dont even need the array...Of course this is assuming they are all .jpg files. This also lets you update the picture without having to worry about the name.

<img id="pics" …
Jump to Post

All 5 Replies

<img src="" id="pics">
<script>
var m=new Date();
var imageArray = [
    "Holiday/HolidayDesktops/Newyear.jpg",
    "Holiday/HolidayDesktops/Vday.jpg",
    "Holiday/HolidayDesktops/St.Patday.jpg",
    "Holiday/HolidayDesktops/Easter.jpg",
    "Holiday/HolidayDesktops/MemorialDay.jpg",
    "Holiday/HolidayDesktops/NatFlagDay.jpg",
    "Holiday/HolidayDesktops/July4.jpg",
    "Holiday/HolidayDesktops/WomensEqualityDay.jpg",
    "Holiday/HolidayDesktops/LaborDay.jpg",
    "Holiday/HolidayDesktops/Halloween.jpg",
    "Holiday/HolidayDesktops/Thanksgiving.jpg",
    "Holiday/HolidayDesktops/Christmas.jpg",
];
document.getElementById("pics").src=imageArray[m.getMonth()];
</script>

Here is another alternative...

If you name your pictures from 0-11 (Jan is 0, Dec is 11), then you dont even need the array...Of course this is assuming they are all .jpg files. This also lets you update the picture without having to worry about the name.

<img id="pics" />

<script>
 var m=new Date();
 var path="Holiday/HolidayDesktops/";
 document.getElementById("pics").src=path + m.getMonth() + ".jpg";
</script>
Member Avatar

These were great and it works perfectly (at least I'll know next month if I put in the array correctly). Thank you for your help.

glad this solved your issue. let us know how it goes...

Member Avatar

Ok, so this worked great. Y'all are amazing. Now, I want to add a statement that will put up a different picture to mark my wedding anniversary. then go back to the original program. Here is what I have that doesn't work.

var m= new Date();
var d= new Date();

if (m.getMonth()==0 && d.getDay()==11){


document.getElementById('pics').src="Holiday/HolidayDesktops/anniversary.jpg";
}

else{
var imageArray=[
"Holiday/HolidayDesktops/Newyear.jpg",
"Holiday/HolidayDesktops/Vday.jpg",
"Holiday/HolidayDesktops/St.Patday.jpg",
"Holiday/HolidayDesktops/Easter.jpg",
"Holiday/HolidayDesktops/MemorialDay.jpg",
"Holiday/HolidayDesktops/NatFlagDay.jpg",
"Holiday/HolidayDesktops/July4.jpg",
"Holiday/HolidayDesktops/WomensEqualityDay.jpg",
"Holiday/HolidayDesktops/LaborDay.jpg",
"Holiday/HolidayDesktops/Halloween.jpg",
"Holiday/HolidayDesktops/Thanksgiving.jpg",
"Holiday/HolidayDesktops/Christmas.jpg"

];


document.getElementById('pics').src=imageArray[m.getMonth()];
}
Be a part of the DaniWeb community

We're a friendly, industry-focused community of 1.19 million developers, IT pros, digital marketers, and technology enthusiasts learning and sharing knowledge.