Can someone help me fix this code? I am trying to change images on my webpage base on time and day of the week. For example lets say today is monday i want an image to display from 9am to 12 pm and tuesday and so on. Please help
<html>
<body>
</body>
<script>
var date = new Date();
var hour = date.getHours();
var day = date.getDays();
if (hour > 9 && hour <= 12 && day === 1)
return 'image2.jpg';
else if (hour > 12 && hour <= 3 && day === 1)
return 'image1.jpg';
else
return 'image2.jpg';
}
var image = document.getElementById('your-image');
image.src = getImageSourceByDate();
</script>
</html>
I just replied in your other cross post
IMHO starting with a simple script at first is a good idea. That’s how I prefer to work up a script. Working - tweak until it breaks - fix - rinse, repeat.
Notice the getImageSourceByDate() and the return lines.
The getImageSourceByDate() line is “calling” a function named “getImageSourceByDate”, but your code (as it is) has no such function.
If you open your browsers dev tools console you may see an “undefined” error message that could help point you to the problem.
Sometimes functions only…
Nothing personal, but I for one have a difficult time keeping up with cross posts. Please stop doing it.
This is a different code and i reallly need help with getting this to work. I am so confused
You were close, but you have a few issues
you missed your function definition function getImageSourceByDate() {
at the top of your script
you meant to use getDay
instead of getDays
you forgot to have your <img id="your-image" />
here tag above your script and in the body element.
you needed to have your script inside the <body></body>
tags
<html>
<body>
<img id="your-image" />
<script type="text/javascript">
function getImageSourceByDate() {
var date = new Date();
var hour = date.getHours();
var day = date.getDay();
if (hour > 9 && hour <= 12 && day === 1)
return 'https://media.giphy.com/media/26gsk7BaYn2smKnde/source.gif';
else if (hour > 12 && hour <= 3 && day === 1)
return 'https://media.giphy.com/media/3o7TKDArbPGRbwH0XK/source.gif';
else
return 'https://media.giphy.com/media/3o7TKr2XFDCA7ZoLkY/source.gif';
}
var image = document.getElementById('your-image');
image.src = getImageSourceByDate();
</script>
</body>
</html>
As a codepen:
This works thank you. Any idea how can i add minutes inside of it?
Thank you so much.
surajkay19:
I am so confused
I am not surprised. You have three topics going at the same time and are getting different approaches to the problem from various members.
Can someone help me fix this code? I am trying to change images on my webpage base on time and day of the week. For example lets say today is monday i want an image to display from 9am to 12 pm and tuesday and so on. Please help
<html>
<body>
</body>
<script>
var date = new Date();
var hour = date.getHours();
var day = date.getDays();
if (hour > 9 && hour <= 12 && day === 1)
return 'image2.jpg';
else if (hour > 12 && hour <= 3 && day === 1)
return 'image1.jpg';
else
return 'image2.jpg';
…
Can someone help me fix this code? I am trying to change images on my webpage base on time and day of the week. For example lets say today is monday i want an image to display from 9am to 12 pm and tuesday and so on. Please help
<html>
<body>
<script type="text/javascript">
var day = new Date();
var today = day.getDay();
var hour = day.getHours();
var minutes = day.getMinutes();
if (today>0 && today<6)
{if (hour = 8)
{if (minutes > 23)
{document.write("<img src="image2.jpg">")}
…
https://www.sitepoint.com/community/t/please-help-me-with-the-code-below/256658
There is good reason cross posting is discouraged.
3 Likes
They are different codes that will do the same thing but it does not work. You have a problem? You don’t have to point it out
Maybe find one set of code that does it right?
Why not have a go at this yourself, then let us know if you get stuck. Simply asking for the solution without demonstrating that you’ve at least attempted to arrive at it yourself is generally considered pretty bad form.
2 Likes
I’m tempted to rework the above code in to a separate function, to make it easier to understand the main code, and allow us to simplify what happens within the function too.
function getImage(day, hour) {
if (day === 1) {
if (hour > 9 && hour <= 12) {
return 'https://media.giphy.com/media/26gsk7BaYn2smKnde/source.gif';
} else if (hour > 12 && hour <= 3) {
return 'https://media.giphy.com/media/3o7TKDArbPGRbwH0XK/source.gif';
}
} else {
return 'https://media.giphy.com/media/3o7TKr2XFDCA7ZoLkY/source.gif';
}
}
...
return getImage(day, hour);
With the if statements int he function organised by the day, it’s easier to understand how you might organise things by the minute too.
system
Closed
June 14, 2017, 5:34am
11
This topic was automatically closed 91 days after the last reply. New replies are no longer allowed.