.drt-calc-container {
max-width: 800px;
margin: 0 auto;
font-family: -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, Helvetica, Arial, sans-serif;
line-height: 1.6;
color: #333;
}
.calc-box {
background: #f8f9fa;
border: 1px solid #e9ecef;
border-radius: 8px;
padding: 30px;
margin-bottom: 40px;
box-shadow: 0 4px 6px rgba(0,0,0,0.05);
}
.calc-header {
text-align: center;
margin-bottom: 25px;
border-bottom: 2px solid #007bff;
padding-bottom: 10px;
}
.form-group {
margin-bottom: 20px;
}
.form-group label {
display: block;
margin-bottom: 8px;
font-weight: 600;
color: #495057;
}
.form-control {
width: 100%;
padding: 12px;
border: 1px solid #ced4da;
border-radius: 4px;
font-size: 16px;
box-sizing: border-box;
transition: border-color 0.15s ease-in-out;
}
.form-control:focus {
border-color: #007bff;
outline: 0;
box-shadow: 0 0 0 0.2rem rgba(0,123,255,.25);
}
.btn-calc {
display: block;
width: 100%;
padding: 14px;
background-color: #007bff;
color: white;
border: none;
border-radius: 4px;
font-size: 18px;
font-weight: bold;
cursor: pointer;
transition: background-color 0.2s;
margin-top: 20px;
}
.btn-calc:hover {
background-color: #0056b3;
}
.result-box {
margin-top: 25px;
padding: 20px;
background-color: #e8f4fd;
border-left: 5px solid #007bff;
border-radius: 4px;
display: none;
}
.result-title {
font-weight: bold;
font-size: 1.1em;
margin-bottom: 10px;
color: #0056b3;
}
.result-value {
font-size: 2em;
font-weight: bold;
color: #212529;
}
.result-steps {
margin-top: 15px;
font-size: 0.95em;
background: #fff;
padding: 10px;
border: 1px solid #dee2e6;
}
.hidden {
display: none;
}
.unit-label {
font-size: 0.85em;
color: #666;
margin-left: 5px;
font-weight: normal;
}
// Initial setup
window.onload = function() {
updateFormVisibility();
};
function updateFormVisibility() {
var type = document.getElementById('problemType').value;
var groupD = document.getElementById('group_distance');
var groupR = document.getElementById('group_rate');
var groupT = document.getElementById('group_time');
var groupS1 = document.getElementById('group_speed1');
var groupS2 = document.getElementById('group_speed2');
// Reset all to hidden first
groupD.style.display = 'none';
groupR.style.display = 'none';
groupT.style.display = 'none';
groupS1.style.display = 'none';
groupS2.style.display = 'none';
// Show based on selection
if (type === 'solve_d') {
groupR.style.display = 'block';
groupT.style.display = 'block';
} else if (type === 'solve_r') {
groupD.style.display = 'block';
groupT.style.display = 'block';
} else if (type === 'solve_t') {
groupD.style.display = 'block';
groupR.style.display = 'block';
} else if (type === 'meet' || type === 'catch') {
groupD.style.display = 'block'; // Represents distance apart or headstart
groupS1.style.display = 'block';
groupS2.style.display = 'block';
// Update label for distance based on context
var distLabel = document.querySelector('label[for="input_distance"]');
if (type === 'meet') distLabel.innerHTML = 'Distance Apart (miles, km)';
if (type === 'catch') distLabel.innerHTML = 'Head Start Distance (miles, km)';
}
// Hide results when mode changes
document.getElementById('result_display').style.display = 'none';
}
function calculateDRT() {
var type = document.getElementById('problemType').value;
var resultBox = document.getElementById('result_display');
var finalAnswer = document.getElementById('final_answer');
var steps = document.getElementById('calculation_steps');
var valD = parseFloat(document.getElementById('input_distance').value);
var valR = parseFloat(document.getElementById('input_rate').value);
var valT = parseFloat(document.getElementById('input_time').value);
var valS1 = parseFloat(document.getElementById('input_speed1').value);
var valS2 = parseFloat(document.getElementById('input_speed2').value);
var answer = 0;
var formulaHTML = "";
var unit = "";
// Validation
if (type === 'solve_d' && (isNaN(valR) || isNaN(valT))) {
alert("Please enter both Rate and Time."); return;
}
if (type === 'solve_r' && (isNaN(valD) || isNaN(valT))) {
alert("Please enter both Distance and Time."); return;
}
if (type === 'solve_t' && (isNaN(valD) || isNaN(valR))) {
alert("Please enter both Distance and Rate."); return;
}
if ((type === 'meet' || type === 'catch') && (isNaN(valD) || isNaN(valS1) || isNaN(valS2))) {
alert("Please enter Distance and both Speeds."); return;
}
// Calculation Logic
if (type === 'solve_d') {
answer = valR * valT;
unit = "Distance Units";
formulaHTML = "Formula: d = r × t" +
"Math: " + valR + " × " + valT + " = " + answer;
finalAnswer.innerHTML = answer + " Distance Units";
}
else if (type === 'solve_r') {
if (valT === 0) { alert("Time cannot be zero."); return; }
answer = valD / valT;
formulaHTML = "Formula: r = d / t" +
"Math: " + valD + " / " + valT + " = " + answer.toFixed(2);
finalAnswer.innerHTML = answer.toFixed(2) + " Speed Units";
}
else if (type === 'solve_t') {
if (valR === 0) { alert("Rate cannot be zero."); return; }
answer = valD / valR;
formulaHTML = "Formula: t = d / r" +
"Math: " + valD + " / " + valR + " = " + answer.toFixed(2);
finalAnswer.innerHTML = answer.toFixed(2) + " Time Units";
}
else if (type === 'meet') {
// Time until meeting = Distance / (Speed1 + Speed2)
var combinedSpeed = valS1 + valS2;
if (combinedSpeed === 0) { alert("Combined speed is zero."); return; }
answer = valD / combinedSpeed;
formulaHTML = "Scenario: Objects moving towards each other." +
"Combined Speed: " + valS1 + " + " + valS2 + " = " + combinedSpeed + "" +
"Time until meeting: " + valD + " / " + combinedSpeed + " = " + answer.toFixed(2);
finalAnswer.innerHTML = answer.toFixed(2) + " Time Units";
}
else if (type === 'catch') {
// Time to catch = Distance / (Speed1 – Speed2)
// Assuming S1 is faster
var speedDiff = Math.abs(valS1 – valS2);
if (speedDiff === 0) {
alert("Speeds are identical, the objects will never catch up or change distance.");
return;
}
answer = valD / speedDiff;
formulaHTML = "Scenario: One object catching another." +
"Speed Difference: |" + valS1 + " – " + valS2 + "| = " + speedDiff + "" +
"Time to catch up: " + valD + " / " + speedDiff + " = " + answer.toFixed(2);
finalAnswer.innerHTML = answer.toFixed(2) + " Time Units";
}
steps.innerHTML = formulaHTML;
resultBox.style.display = 'block';
}
Distance Rate Time Solver
Solve for Distance (d = r × t)
Solve for Rate/Speed (r = d / t)
Solve for Time (t = d / r)
Two Objects Meeting (Opposite Directions)
Two Objects Catching Up (Same Direction)
Result:
Understanding Distance, Rate, and Time Word Problems
Distance-Rate-Time (DRT) problems are a staple of algebra and physics. Whether you are planning a road trip, calculating arrival times for trains, or determining how long it takes to catch up to a friend, these problems all rely on the same fundamental relationship.
The Magic Formula
The core equation governing motion at a constant speed is:
d = r × t
Where:
- d = Distance (miles, kilometers, meters, feet)
- r = Rate or Speed (mph, km/h, m/s)
- t = Time (hours, minutes, seconds)
The "Triangle" Method
If you struggle to remember how to rearrange the formula, visualize a triangle with d at the top and r and t at the bottom.
- Find Distance: Cover d. You see r next to t, so you multiply ($r \times t$).
- Find Rate: Cover r. You see d over t, so you divide ($d / t$).
- Find Time: Cover t. You see d over r, so you divide ($d / r$).
Common Word Problem Scenarios
1. The Meeting Problem (Opposite Directions)
Example: Two cars leave cities 300 miles apart at the same time and drive toward each other. Car A drives 60 mph, Car B drives 40 mph. When will they meet?
In this scenario, the gap between the cars is closing at the sum of their speeds.
Formula: Time = Total Distance / (Speed 1 + Speed 2).
Math: 300 / (60 + 40) = 300 / 100 = 3 hours.
2. The Catch-Up Problem (Same Direction)
Example: A truck leaves the station traveling 50 mph. A car leaves 1 hour later traveling 70 mph. How long until the car catches the truck?
First, calculate the "Head Start Distance". Since the truck drove for 1 hour at 50 mph, the head start is 50 miles. The car catches up based on the difference in their speeds.
Formula: Time = Head Start Distance / (Fast Speed – Slow Speed).
Math: 50 / (70 – 50) = 50 / 20 = 2.5 hours.
Tips for Success
- Check your units: Never mix hours with minutes. If speed is in MPH (Miles Per Hour), ensure your time is in Hours (e.g., 90 minutes = 1.5 hours).
- Draw a picture: Sketching a diagram of the paths helps visualize whether you are adding or subtracting speeds.
- Verify the answer: Does the result make sense? If you calculate a car is driving 5000 mph, check your decimal points!