Display image based on date (holidays)

Y

Yeah

I have alternate holiday headers for my web site, and I would like to
display a certain image for an upcoming holiday. Examples:

Christmas 12/10 - 12/26
New Years Eve 12/27 - 1/2
Halloween 10/15 - 11/1
etc. etc.

If the date doesn't fall in any upcoming holiday ranges, then the default
image is displayed.

I've scoured the Web, but not quite able to find anything. Does anyone have
any pointers? Thanks!
 
V

VK

Yeah said:
I have alternate holiday headers for my web site, and I would like to
display a certain image for an upcoming holiday. Examples:

Christmas 12/10 - 12/26
New Years Eve 12/27 - 1/2
Halloween 10/15 - 11/1
etc. etc.
Click to expand...

Your date ranges for holidays are a bit proprietary but you're the king
I guess...
If the date doesn't fall in any upcoming holiday ranges, then the default
image is displayed.

I've scoured the Web, but not quite able to find anything. Does anyone have
any pointers? Thanks!
Click to expand...


The current day and month on the client machine (assuming her clock is
set right) can be retrieved by using:
var now = new Date();
var day = now.getDay();
var month = now.getMonth();
// where January == 0 and December == 11

A *named* image can be accessed like:
document.images['ImageName'].src = 'myImageRepository/someImage.gif';

Some immediate action upon page is finished to load can be tacken by
using:
<body onload="myFunction()">

I'm leaving the pleasure to write the final solution code on you.
 
R

RobG

VK wrote:
[...]
The current day and month on the client machine (assuming her clock is
set right) can be retrieved by using:
var now = new Date();
var day = now.getDay();
Click to expand...

Day number is good, but date may be more useful... :)

var theDate = now.getDate();

[...]
 
L

Lee

Yeah said:
I have alternate holiday headers for my web site, and I would like to
display a certain image for an upcoming holiday. Examples:

Christmas 12/10 - 12/26
New Years Eve 12/27 - 1/2
Halloween 10/15 - 11/1
etc. etc.

If the date doesn't fall in any upcoming holiday ranges, then the default
image is displayed.

I've scoured the Web, but not quite able to find anything. Does anyone have
any pointers? Thanks!
Click to expand...
<html>
<head>
<title>holiday image demo</title>
<script type="text/javascript">

var holiday = [
[ "1015", "1101", "halloween.jpg" ],
[ "1210", "1226", "christmas.jpg" ],
[ "1227", "1231", "newyear.jpg" ],
[ "0101", "0102", "newyear.jpg" ]
];

function disable(){return false}

function setImgByDate(imgRef,dateList) {
imgRef.onload = disable;
var today = new Date();
var month = 1+today.getMonth();
if (month<10) month = "0"+month;
var date = today.getDate();
if (date<10) date = "0"+date;
var MMDD = ""+month+date;
for (var i=0; i<dateList.length; i++) {
if (MMDD>=dateList[0] && MMDD<=dateList[1]) {
imgRef.src = dateList[2];
return;
}
}
}
</script>
</head>
<body>
<img src="default.jpg"
onload="setImgByDate(this,holiday)">
</body>
</html>
 
M

Mick White

Yeah said:
I have alternate holiday headers for my web site, and I would like to
display a certain image for an upcoming holiday. Examples:

Christmas 12/10 - 12/26
New Years Eve 12/27 - 1/2
Halloween 10/15 - 11/1
etc. etc.

If the date doesn't fall in any upcoming holiday ranges, then the default
image is displayed.

I've scoured the Web, but not quite able to find anything. Does anyone have
any pointers? Thanks!
Click to expand...
<script type="text/javascript">
function H(){
var s=new Date();
var isXmas=
s.getMonth()==11 && s.getDate()>9 && s.getDate()<27;

var isNewYear=
(s.getMonth()==11 && s.getDate()>26) ||
(s.getMonth()==0 && s.getDate()<3);

document.images["seasonal"].src=
isNewYear?"ny.gif":isXmas?"xmas.gif":"default.gif";
}
onload=H;
</script>

<body>
<img src="default.gif" name="seasonal">

You can work out "Halowe'en"
Mick
 
D

Dr John Stockton

JRS: In article <YaL8f.2543$0M1.467@dukeread12>, dated Sat, 29 Oct 2005
08:55:39 said:
I have alternate holiday headers for my web site, and I would like to
display a certain image for an upcoming holiday. Examples:

Christmas 12/10 - 12/26
New Years Eve 12/27 - 1/2
Halloween 10/15 - 11/1
etc. etc.

If the date doesn't fall in any upcoming holiday ranges, then the default
image is displayed.

I've scoured the Web, but not quite able to find anything. Does anyone have
any pointers? Thanks!
Click to expand...

If you were looking for relevant material, rather than just for a
prefabricated exact solution, then you need more practice in scouring.
The FAQ of this newsgroup is on the Web; see below.

Are those partial FFF dates or partial mis-separated ISO ones?

For comparisons, use no date Objects other than for determining the
current month and date; work with pseudo-dates.

Think about whether the dates should be GMT or local to the user or
local to yourself.
 
D

Dr John Stockton

JRS: In article <[email protected]>, dated Sat, 29 Oct 2005
10:27:21, seen in Lee
var today = new Date();
var month = 1+today.getMonth();
if (month<10) month = "0"+month;
var date = today.getDate();
if (date<10) date = "0"+date;
var MMDD = ""+month+date;
Click to expand...

No need to build strings from numbers.

PD = month*100 + date // Pseudo-Date

can be compared with Numbers such as 0117 (MLK day) and 1105 (GF night).

Pseudo-Dates can always be used instead of "real" dates when the lengths
of days, months and years are irrelevant.

See via FAQ.
 

Ask a Question

Want to reply to this thread or ask your own question?

You'll need to choose a username for the site, which only take a couple of moments. After that, you can post your question and our members will help you out.

Ask a Question

Similar Threads

Taskcproblem calendar 4
New to coding - image to the time of day based on time 2
Working on mobile css menu with plenty of frustration! 2
Display image based on upcoming holiday 27
PHP RSS Feed Aggregator changing to todays date everytime feed is aggregated 1
Help with my responsive home page 2
A number everyday of the month "and" a different number depending on the day of the month´s day time 2
Date format 1

Members online

No members online now.
Total: 26 (members: 0, guests: 26)
Robots: 30

Forum statistics

Threads
473,795
Messages
2,569,644
Members
45,356
Latest member
deepthi.kodakandla

Latest Threads

Top