This is a little jQuery function I wrote to add a selected class to an element based on the current date and time (using date timestamp). The idea being to set a current session which is currently showing, like shown in the screenshot below.
* Author: Sam Deering
* Adds/removes a selected class on elements based on the current date and time.
* usage: $('.program p').dateTimeHighlightNow();
jQuery.fn.dateTimeHighlightNow = function()
var datetimestamp = Math.round(new Date().getTime() / 1000)
elem = $(this),
start = elem.attr('start'),
log('datetimestamp = '+datetimestamp);
if (start < datetimestamp && finish > datetimestamp)
Your HTML code should look something like this:
Further usage could be to run the event every 1 minute (or so) for auto refresh:
/* monitor for auto change of current active session based on date/time */
//run every minute
Even Further thoughts
- PHP timestamp is executed on the server side (your servers system clock).
- A futher check to convert the clients Time Zone settings to the servers to highlight current session (this is something I may look into implementing in the near future so stay tuned for that).