Time, Hours, Minute Calculator Source Code Website

चाहे आप काम कर रहे हों, पढ़ाई कर रहे हों, या Day की योजना बना रहे हों, Time का प्रभावी प्रबंधन बेहद ज़रूरी है। हमारा Time, Hours और Minute Calculator आपको अवधि की गणना करने, Time इकाइयों को बदलने, और अपने समय को आसानी से ट्रैक करने में मदद करता है। जानिए कि कैसे यह Tool आपकी उत्पादकता को बढ़ा सकता है और आपके दैनिक कार्यों को कुछ ही क्लिक में आसान बना सकता है। जानने के लिए Click Here

ऊपर मैने Link दे दिया है, उस पर क्लिक करके जान सकते हो। कि कैसे काम करता है, लेकिन मेरा Topic Time, Hours, Minute calculator कैसे बनाएं। तो चलते.. इस कोड में आप पूरे Function को Check कर सकते हो। जैसे कि –

  • समय कैलकुलेटर- Time
  • घंटे और मिनट परिवर्तन- Hours, Minute
  • समय प्रबंधन टूल
  • अवधि कैलकुलेटर
  • उत्पादकता टूल
  • ऑनलाइन समय ट्रैकिंग
  • समय ट्रैकिंग समाधान

सबसे पहले ये Html, CSS, Javascript Code है। इसे Copy करके अपने Local फाइल में सेव करके इसे अपने Browser पर चेंक करें।

<!DOCTYPE html>
<html lang=”en”>
<head>
<meta charset=”UTF-8″>
<meta name=”viewport” content=”width=device-width, initial-scale=1.0″>
<title>Hours Calculator</title>
<style>
body {
font-family: Arial, sans-serif;
margin: 0;
padding: 0;
display: flex;
justify-content: center;
align-items: center;
min-height: 100vh;
background-color: #f4f4f9;
}

.container {
max-width: 500px;
width: 90%;
background: #ffffff;
box-shadow: 0 4px 6px rgba(0, 0, 0, 0.1);
border-radius: 8px;
padding: 20px;
}

h1 {
text-align: center;
font-size: 24px;
color: #333333;
margin-bottom: 20px;
}

.input-group {
display: flex;
flex-direction: column;
gap: 10px;
margin-bottom: 20px;
}

label {
font-size: 16px;
color: #555555;
}

input[type=”time”] {
padding: 10px;
font-size: 16px;
border: 1px solid #dddddd;
border-radius: 4px;
}

button {
padding: 10px 20px;
font-size: 16px;
color: #ffffff;
background: #007bff;
border: none;
border-radius: 4px;
cursor: pointer;
transition: background 0.3s;
}

button:hover {
background: #0056b3;
}

.result {
margin-top: 20px;
font-size: 18px;
color: #333333;
text-align: center;
}
</style>
</head>
<body>
<div class=”container”>
<h1>Hours Times Calculator</h1>
<div class=”input-group”>
<label for=”start-time”>Start Time:</label>
<input type=”time” id=”start-time”>
</div>
<div class=”input-group”>
<label for=”end-time”>End Time:</label>
<input type=”time” id=”end-time”>
</div>
<button id=”calculate-btn”>Calculate Hours</button>
<div class=”result” id=”result”></div>
<h2>Hours Calculator – calculate hours between times
</h2>
This simple online utility tool makes it easy to calculate the difference in hours and minutes between two given times. To calculate the hours and minutes contained in a time period you need to know its beginning and end time.

<br><h3>How to caluclate hours between times?
</h3>
<br>Follow below steps to calculate hours between times.

In the above box just input start and end time with given format.
Or simply click on 🕓 Clock icon.
A time picker popup will open where you can select hours, minutes and AM/PM.
Finally click on Calculate Hours button.
</div>

<script>
const startTimeInput = document.getElementById(‘start-time’);
const endTimeInput = document.getElementById(‘end-time’);
const calculateBtn = document.getElementById(‘calculate-btn’);
const resultDiv = document.getElementById(‘result’);

function calculateHours(startTime, endTime) {
const [startHours, startMinutes] = startTime.split(‘:’).map(Number);
const [endHours, endMinutes] = endTime.split(‘:’).map(Number);

let start = new Date();
start.setHours(startHours, startMinutes);

let end = new Date();
end.setHours(endHours, endMinutes);

if (end < start) {
end.setDate(end.getDate() + 1); // Handle overnight calculations
}

const diff = end – start;
const hours = Math.floor(diff / (1000 * 60 * 60));
const minutes = Math.floor((diff % (1000 * 60 * 60)) / (1000 * 60));

return `${hours} hour(s) and ${minutes} minute(s)`;
}

calculateBtn.addEventListener(‘click’, () => {
const startTime = startTimeInput.value;
const endTime = endTimeInput.value;

if (startTime && endTime) {
const result = calculateHours(startTime, endTime);
resultDiv.textContent = `Duration: ${result}`;
} else {
resultDiv.textContent = ‘Please enter both start and end times.’;
}
});
</script>

</body>
</html>

 

1. समय, घंटे और मिनट कैलकुलेटर क्या है?
जानें कि यह टूल कैसे काम करता है और आपके शेड्यूल को कुशलतापूर्वक प्रबंधित करने में क्यों महत्वपूर्ण है।

2. समय कैलकुलेटर की मुख्य विशेषताएं
अवधि की गणना से लेकर घंटे और मिनटों के परिवर्तन तक, इस टूल की अनमोल विशेषताओं के बारे में जानें।

3. बेहतर समय प्रबंधन के लिए कैलकुलेटर का उपयोग कैसे करें
समय की गणना और अपने दिन को सहजता से व्यवस्थित करने के लिए चरण-दर-चरण निर्देश।

4. समय कैलकुलेटर का उपयोग करने के प्रमुख लाभ
जानें कि यह टूल कैसे आपका समय बचाता है और आपकी उत्पादकता बढ़ाता है।

5. कौन कर सकता है समय, घंटे और मिनट कैलकुलेटर का उपयोग?
चाहे आप छात्र हों, पेशेवर हों, या फ्रीलांसर हों, देखें कि यह टूल आपकी आवश्यकताओं के अनुकूल कैसे है।

6. समय कैलकुलेटर से जुड़े सामान्य प्रश्न (FAQs)
सटीकता, उपयोग और सर्वोत्तम प्रथाओं के बारे में सामान्य सवालों के जवाब।

Leave a Comment