jQuery Clock Server Example

Source Code at https://github.com/Lwangaman/jQuery-Clock-Plugin

Current Server Time:

Wednesday, December 6, 2023
Time being fed into the jquery clock:
09:11:51 AM PST
Compensate for server timezone offset, as above:
09:11:51 AM America/Los_Angeles
Server time as is, without timezone offset compensation:
05:11:51 PM America/Los_Angeles
As above but using gmdate('U') instead of time():
05:11:51 PM America/Los_Angeles
Using gmstrftime() and time():
01:11:51 AM GMT
Server timezone picked up as:
America/Los_Angeles

Compared to Current Local Time:

<!DOCTYPE html> 
<html> 
  <head> 
    <title>jQuery Clock server side example</title> 
    <meta charset="UTF-8"> 
    <style type="text/css"> 
      body { background-color: Gray; } 
      #clocks-container { border: 1px groove White; border-radius: 15px; padding: 10px; width: 50%; margin: 30px auto; background-color: LightGray; text-align: center; } 
      /* SAMPLE CSS STYLES FOR JQUERY CLOCK PLUGIN */ 
      .jqclock { text-align:center; border: 2px #369 ridge; background-color: #69B; padding: 10px; margin:20px auto; width: 40%; box-shadow: 5px 5px 15px #005; } 
      .clockdate { color: DarkRed; font-weight: bold; background-color: #7AC; margin-bottom: 10px; font-size: 18px; display: block; padding: 5px 0; } 
      .clocktime { border: 2px inset DarkBlue; background-color: #444; padding: 5px 0; font-size: 14px; font-family: "Courier"; color: LightGreen; margin: 2px; display: block; font-weight:bold; text-shadow: 1px 1px 1px Black; } 
    </style> 
    <script type="text/javascript" src="//ajax.googleapis.com/ajax/libs/jquery/1/jquery.min.js"></script> 
    <script type="text/javascript" src="//gitcdn.link/repo/Lwangaman/jQuery-Clock-Plugin/master/jqClock.min.js"></script> 
    <script type="text/javascript"> 
      $(document).ready(function(){ 
        customtimestamp = parseInt($("#jqclock").data("time"));
        $("#jqclock").clock({"langSet":"en","timestamp":customtimestamp}); 
        $("#jqclock-local").clock({"langSet":"en"}); 
      }); 
    </script> 
  </head> 
  <body> 
    <h1>jQuery Clock Server Example</h1> 
    <p>Source Code at <a href="https://github.com/Lwangaman/jQuery-Clock-Plugin">https://github.com/Lwangaman/jQuery-Clock-Plugin</a></p> 
    
    <div id="clocks-container"> 
      <h2>Current Server Time:</h2> 
      <div id="jqclock" class="jqclock" data-time="<?php echo time(); ?>"></div> 
      
      <h2>Compared to Current Local Time:</h2> 
      <div id="jqclock-local" class="jqclock"></div> 
      
    </div> 
  </body> 
</html>