Does not work, Did you test it?
The code didnāt work because you have Hour instead hour.Check always your console for errors.It is a very useful tool to see what is going wrong.I tested the following code in liveweave and works
var day = new Date();
var today =parseInt(day.getDay());
var hour = parseInt(day.getHours());
var minutes = parseInt(day.getMinutes());
var imgElem=document.getElementById('image_1');
(function(){
if(today>=2 && today<=6){
if(hour>=10 && minutes<23){
imgElem.src='https://upload.wikimedia.org/wikipedia/commons/thumb/e/ec/Great_Red_Spot_From_Voyager_1.jpg/150px-Great_Red_Spot_From_Voyager_1.jpg';
}else if(minutes>=23 && minutes<45){
imgElem.src='https://upload.wikimedia.org/wikipedia/en/thumb/9/97/Pluton_by_Henri_Chapu.png/220px-Pluton_by_Henri_Chapu.png';
}else{
imgElem.src='https://upload.wikimedia.org/wikipedia/commons/thumb/a/a2/Jan_Brueghel_%28I%29_-_Orpheus_in_the_Underworld_-_WGA03564.jpg/300px-Jan_Brueghel_%28I%29_-_Orpheus_in_the_Underworld_-_WGA03564.jpg';
}
}
})();
Hey thank you so much it finally works. Just want to know if i want to add a next day into the code, is the code below right?
<!DOCTYPE html>
<html>
<head>
</head>
<<body>
<img src="" alt="" id="image_1" />
</body>
<script>
var day = new Date();
var today =parseInt(day.getDay());
var hour = parseInt(day.getHours());
var minutes = parseInt(day.getMinutes());
var imgElem=document.getElementById('image_1');
(function(){
if(today>=2 && today<=6){
if(hour>=14 && minutes<50){
imgElem.src='image2.jpg';
}else if(minutes>=23 && minutes<45){
imgElem.src='image1.jpg';
}else{
imgElem.src='image3.jpg';
}
}
})();
(function(){
if(today>=3 && today<=6){
if(hour>=14 && minutes<50){
imgElem.src='image2.jpg';
}else if(minutes>=23 && minutes<45){
imgElem.src='image1.jpg';
}else{
imgElem.src='image3.jpg';
}
}
})();
</script>
</html>
It works nevermind. Thank you so so much for your time taken to help me.
You welcome.If you want to add next day work like the following:
function(){
if(today==0){
if(hour>=14 && minutes<50){
imgElem.src='image2.jpg';
}else if(minutes>=23 && minutes<45){
imgElem.src='image1.jpg';
}else{
imgElem.src='image3.jpg';
}
}
if(today==1){
if(hour>=14 && minutes<50){
imgElem.src='image2.jpg';
}else if(minutes>=23 && minutes<45){
imgElem.src='image1.jpg';
}else{
imgElem.src='image3.jpg';
}
}
if(today==2){
if(hour>=14 && minutes<50){
imgElem.src='image2.jpg';
}else if(minutes>=23 && minutes<45){
imgElem.src='image1.jpg';
}else{
imgElem.src='image3.jpg';
}
}
})();
Or you can work with the switch case statement like this:
(function(){
switch(today){
case 0:
if(hour>=14 && minutes<50){
imgElem.src='image2.jpg';
}else if(minutes>=23 && minutes<45){
imgElem.src='image1.jpg';
}else{
imgElem.src='image3.jpg';
}
break;
case 1:
if(hour>=14 && minutes<50){
imgElem.src='image2.jpg';
}else if(minutes>=23 && minutes<45){
imgElem.src='image1.jpg';
}else{
imgElem.src='image3.jpg';
}
break;
}
})();
Great thanks a lot. You are a genius. You mind be my friend please?
My pleasure.
I just have a last question sorry,
If i wanna add a next time, will this be right? OR what statement should i use? IF or ELSE IF?
if(today==0){
if(hour>=14 && minutes<50){
imgElem.src='image2.jpg';
}else if(minutes>=23 && minutes<45){
imgElem.src='image1.jpg';
}else{
imgElem.src='image3.jpg';
}
}
if(today==0){
if(hour>=14 && minutes<50){
imgElem.src=āimage2.jpgā;
}else if(minutes>=23 && minutes<45){
imgElem.src=āimage1.jpgā;
}else if(minutes>=23 && minutes<45){
imgElem.src=āimage1.jpgā;
}else{
imgElem.src=āimage3.jpgā;
}
}
else if statement for times before the final time set.
Sorry to bother you again, but i am trying at in between time, do know what will work? Becuase this is not working below
else if (hour > 12 && hour <= 3 && minutes < 10)
return 'image1.jpg';
How would you demonstrate a time like this in the code:
for example lets say day = 1
i want to display an image from 7.10 am to 9am and then display a next one at 9 to 12pm and then a next one from 12.30 to 3pm.
That looks pretty easy. It should be something like this:
if (day === 1) {
if (hour >= 7 && min >= 10 && hour < 9) {
img = "..."; // for when between 7:10 and 9
} else if (hour >= 9 && hour < 12) {
img = "..."; // for between 9 and 12
} else if (hour >= 12 && min >= 30 && hour < 15) {
img = "..."; // for between 12:30 and 3
} else {
img = "..."; // some default image for day 1
}
}
Notice that the period between 12 and 12:30 will also use the default day 1 image too.
this code is different. Please look above
I am giving examples that anybody can learn from. I consider that my job here is not to do the work for you.
2 Likes
Iām sorry. I actually meant I tried your concept but it does not work. I apoligize
(function(){
if(today === 2 && today<=6){
if(hour =21 && hour < 22){
imgElem.src='image1.jpg';
} if(hour=22 && hour <23){
imgElem.src='image2.jpg';
} if(hour=23 && minutes => 53 && hour < 24){
imgElem.src='image3.jpg';
}else{
imgElem.src='image2.jpg';
}
}
Even though i changed the time an check it, it is stuck on the same image
It looks like you are suffering from the same problem that you had before. A single equals sign is used to assign the value to its right to the what is on its left.
A double equals is to compare two values. A triple equals is better to use though for the double equals results in many side-effects that are best to be avoided.
Youāre needing:
if (hour === 21 && ...) {
And so on for the other occasions that you are doing an equality comparison.
Wow Thank you soo much. It works perfectly now. Those triple equal sign were really important.Thanks for this learning experince and thanks for not giving up with this code. I really appreciate it
You can simplify these lines:
if(hour === 21 && hour < 22){
...
} if(hour === 22 && hour <23){
...
} if(hour === 23 && minutes => 53 && hour < 24){if you think about it. If the hour meets the first comparison, then by definition it will meet the second, since 21 is always less than 22, and 22 is always less than 23, and so on.