# How do show hide image on time in html
**URL:** https://forum.kirupa.com/t/how-do-show-hide-image-on-time-in-html/635834
**Category:** Uncategorized
**Created:** [January 18, 2017, 6:48am UTC](https://forum.kirupa.com/t/how-do-show-hide-image-on-time-in-html/635834 "2017-01-18T06:48:56Z")
**Posts on this page:** 9
**Page:** 1
### Author:  [@Sukhwinder\_Saini](https://forum.kirupa.com/u/Sukhwinder_Saini)
#### Post date: [January 18, 2017, 6:48am UTC](https://forum.kirupa.com/t/how-do-show-hide-image-on-time-in-html/635834/1 "2017-01-18T06:48:56Z")
Suppose that i have two images x.jpg and y.jpg and i want make X.jpg visible at 2:00 pm and Y.jpg at 3:00 pm how could i do it using html and java script
---
### Author:  [@kirupa](https://forum.kirupa.com/u/kirupa)
#### Post date: [January 18, 2017, 7:29am UTC](https://forum.kirupa.com/t/how-do-show-hide-image-on-time-in-html/635834/2 "2017-01-18T07:29:33Z")
Does the time need to be specified from a central location, or would reading the local clock be OK? In other words, I can change my local clock and have the images appear whenever I want.
---
### Author:  [@Sukhwinder\_Saini](https://forum.kirupa.com/u/Sukhwinder_Saini)
#### Post date: [January 18, 2017, 7:43am UTC](https://forum.kirupa.com/t/how-do-show-hide-image-on-time-in-html/635834/3 "2017-01-18T07:43:37Z")
no time is specified with respect to local time
---
### Author:  [@Sukhwinder\_Saini](https://forum.kirupa.com/u/Sukhwinder_Saini)
#### Post date: [January 18, 2017, 7:49am UTC](https://forum.kirupa.com/t/how-do-show-hide-image-on-time-in-html/635834/4 "2017-01-18T07:49:14Z")
## Now see Suppose that the local time is 12:00 pm so none of the time will have to be show when local time is 2:00 pm show image =x.jpg and time local time = 3:00pm show image =y.jpg and hide x.jpg
Something like this
var OPENAT = 2.00; var CLOSEAT = 3.00 function areWeOpen( ) { var sign = document.getElementById("openSign");
---
### Author:  [@Sukhwinder\_Saini](https://forum.kirupa.com/u/Sukhwinder_Saini)
#### Post date: [January 18, 2017, 9:22am UTC](https://forum.kirupa.com/t/how-do-show-hide-image-on-time-in-html/635834/5 "2017-01-18T09:22:29Z")
reply fast man
---
### Author:  [@senocular](https://forum.kirupa.com/u/senocular)
#### Post date: [January 18, 2017, 4:23pm UTC](https://forum.kirupa.com/t/how-do-show-hide-image-on-time-in-html/635834/6 "2017-01-18T16:23:27Z")
You’d want to rely on a server time because you have no idea if the local time is right - at least for something like a we’re open sign.
But if you’re talking just local system time, you can get the current hour (0-23) using `new Date().getHours()`. From that you just see if \>= 2 and \<= 3
```auto
var OPENAT = 2;
var CLOSEAT = 3;
var currentDate = new Date();
var currentHour = currentDate.getHours(); // or get from a more reliable source
if (currentHour >= OPENAT && currentHour <= CLOSEAT) {
// show open sign
} else {
// show closed sign
}
```
How you show which sign can be done any number of ways. You can show/hide with css or you can create and add the image with JavaScript. Or you can have the image already there but have no defined `src` and use JS to set the `src` once you know what it needs to show…
```auto
// ...
var sign = document.getElementById("sign");
if (currentHour >= OPENAT && currentHour <= CLOSEAT) {
sign.src = "open.jpg";
} else {
sign.src = "closed.jpg";
}
```
---
### Author:  [@kirupa](https://forum.kirupa.com/u/kirupa)
#### Post date: [January 18, 2017, 4:28pm UTC](https://forum.kirupa.com/t/how-do-show-hide-image-on-time-in-html/635834/7 "2017-01-18T16:28:47Z")
For getting the time from a more reliable source, you could try this API: [http://davidayala.eu/current-time/](http://davidayala.eu/current-time/)
If you aren’t familiar with making HTTP requests, this article will help: [https://www.kirupa.com/html5/making\_http\_requests\_js.htm](https://www.kirupa.com/html5/making_http_requests_js.htm)
Cheers,
Kirupa 😛
---
### Author:  [@Sukhwinder\_Saini](https://forum.kirupa.com/u/Sukhwinder_Saini)
#### Post date: [January 19, 2017, 7:12am UTC](https://forum.kirupa.com/t/how-do-show-hide-image-on-time-in-html/635834/8 "2017-01-19T07:12:24Z")
can you please give an example using this script with x.jpg and y.jpg in want it with local time on server please …
---
### Author:  [@senocular](https://forum.kirupa.com/u/senocular)
#### Post date: [January 19, 2017, 7:12pm UTC](https://forum.kirupa.com/t/how-do-show-hide-image-on-time-in-html/635834/9 "2017-01-19T19:12:04Z")
It’s pretty much what I posted above. I’ll hook into kirupa’s time api to get a server time too… via fiddle (no images are seen because x and y don’t exist)
[https://jsfiddle.net/aysk29d6/](https://jsfiddle.net/aysk29d6/)