Most of the websites display the current date and time to the visitors in GMT/UTC. If you wish to create something similar like it for your webpage, you can make use of the below simple JavaScript code.
HTML Code:
<div id="gmt-clock" class="gmt-clock"></div>
CSS Code:
<style>
.gmt-clock {
font-family: Arial, sans-serif;
background-color: #f1f1f1;
border: 2px solid #333;
border-radius: 8px;
max-width: 300px;
padding: 5px;
text-align: center;
font-size: 14px;
box-shadow: 2px 2px 6px rgba(0, 0, 0, 0.24);
}
</style>
JavaScript Code:
<script>
function updateGMTClock() {
const clockDiv = document.getElementById("gmt-clock");
const gmtTime = new Date().toUTCString();
clockDiv.textContent = "Time Now: " + gmtTime;
}
setInterval(updateGMTClock, 1000);
updateClock();
</script>
Final Result:
Facing issues? Have Questions? Post them here! I am happy to answer!
Author Info:
Rakesh (He/Him) has over 14+ years of experience in Web and Application development. He is the author of insightful How-To articles for Code2care.
Follow him on: X
You can also reach out to him via e-mail: rakesh@code2care.org
More Posts related to JavaScript,
- How to Run JavaScript on Mac Terminal
- Get Current time in GMT/UTC using JavaScript
- How to yarn reinstall all Packages
- [javaScript] Convert text case to lowercase
- Get Device Screen Width and Height using javaScript
- Fix - npm start: sh: index.js: command not found
- npm WARN saveError ENOENT: no such file or directory, open /mnt/c/package.json
- JavaScript : Get url protocol HTTP, HTTPS, FILE or FTP
- JavaScript: Convert an Image into Base64 String
- JavaScript : Get current page address
- How to get query string in JavaScript HTML location.search
- Create React App using npm command with TypeScript
- JavaScript: Count Words in a String
- Add Animated Scrolling to Html Page Title Script
- How to send email from JavaScript HTML using mailto
- Javascript convert text case from uppercase to lowercase
- Submit html form on dropdown menu value selection or change using javascript
- Send Extra Data with Ajax Get or Post Request
- Fix: SyntaxError: The requested module does not provide an export named default
- Examples: Convert String to int in JavaScript
- 10 ways to Convert String to a Number in JavaScript
- Excel Fix: SECURITY RISK Microsoft has blocked macros from running because the source of this file is untrusted.
- Fix: ReferenceError: require is not defined in ES module scope [Node]
- [JavaScript] Remove all Newlines From String
- How to detect Browser and Operating System Name and Version using JavaScript
More Posts:
- How to upgrade PowerShell on Mac - Powershell
- iPhone network says SOS Only on Status Bar - iOS
- How to show line numbers in Nano on Mac - MacOS
- You can now Transfer Facebook Posts to Google Photos, Docs, Checkout how! - News
- Deploy SharePoint wsp solution package using PowerShell - SharePoint
- Fix - npm start: sh: index.js: command not found - JavaScript
- Your JBoss Application Server 7 is running However you have not yet added any users to be able to access the admin console - Java
- Generate Facebook Android SDK keyhash using java code - Android