Welcome to the Treehouse Community

Want to collaborate on code errors? Have bugs you need feedback on? Looking for an extra set of eyes on your latest project? Get support with fellow developers, designers, and programmers of all backgrounds and skill levels here with the Treehouse Community! While you're at it, check out some resources Treehouse students have shared here.

Looking to learn something new?

Treehouse offers a seven day free trial for new students. Get access to thousands of hours of content and join thousands of Treehouse students and alumni in the community today.

Start your free trial

JavaScript JavaScript Basics (Retired) Working With Numbers Doing Math

Sean Flanagan
Sean Flanagan
33,235 Points
Posted by Sean Flanagan
Sean Flanagan
33,235 Points

How's my code?

Hi. This is my answer to Dave's challenge.

HTML:

<!DOCTYPE html>
<html lang="en">
<head>
  <meta charset="utf-8">
  <link rel="stylesheet" href="css/main.css">
  <title>Time Calculator</title>
 </head>
<body>
  <div class="container">
  <h1>Time calculator</h1>
  <script src="scripts.js"></script>
  </div>
</body>
</html>

CSS:

html,
body,
div,
h1,
h2,
p,
ul,
section {
  margin: 0;
  padding: 0;
  border: 0;
  font: inherit;
  font-size: 100%;
  vertical-align: baseline;
}

html {
  line-height: 1;
}

ul {
  list-style: none;
}

section {
  display: block;
}

body {
  background: #edeff0;
  padding: 50px 0 0;
  font-family: "Helvetica Neue", Helvetica, Arial, sans-serif;
  font-size: 62.5%;
}

h1,
h2 {
  font-size: 2.4em;
  font-weight: 400;
  margin-bottom: 8px;
  color: #384047;
  line-height: 1.2;
}

h2 {
  font-size: 1.8em;
}

p {
  color: #8d9aa5;
  font-size: 1.4em;
  margin-bottom: 15px;
  line-height: 1.4;
}

.container {
  box-sizing: border-box;
  width: 90%;
  max-width: 1080px;
  background: white;
  padding: 30px 15px;
  margin: 0 auto;
  position: relative;
  overflow: hidden;
  border-radius: 5px;
  -webkit-box-shadow: 0 1px 0 0 rgba(0, 0, 0, 0.1);
  -moz-box-shadow: 0 1px 0 0 rgba(0, 0, 0, 0.1);
  box-shadow: 0 1px 0 0 rgba(0, 0, 0, 0.1);
}

.button {
  background: #3f8abf;
  padding: 8px 18px;
  font-family: "Helvetica Neue", Helvetica, Arial, sans-serif;
  font-size: 1.4em;
  color: white;
  font-weight: 500;
  border: 3px solid #3f8abf;
  outline: none;
  cursor: pointer;
  display: -moz-inline-stack;
  display: inline-block;
  vertical-align: middle;
  *vertical-align: auto;
  zoom: 1;
  *display: inline;
  -webkit-border-radius: 5px;
  -moz-border-radius: 5px;
  -ms-border-radius: 5px;
  -o-border-radius: 5px;
  border-radius: 5px;
  -webkit-box-shadow: 0 2px 0 0 #3574a0;
  -moz-box-shadow: 0 2px 0 0 #3574a0;
  box-shadow: 0 2px 0 0 #3574a0;
  -webkit-transition: 0.3s;
  -moz-transition: 0.3s;
  -o-transition: 0.3s;
  transition: 0.3s;
}

.button:hover {
  background: #397cac;
  border-color: #397cac;
  -webkit-box-shadow: 0 2px 0 0 #2c6085;
  -moz-box-shadow: 0 2px 0 0 #2c6085;
  box-shadow: 0 2px 0 0 #2c6085;
}

JavaScript:

var secondsPerMin = 60;
var minsPerHour = 60;
var hoursPerDay = 24;
var daysPerWeek = 7;
var weeksPerYear = 52;
var secondsPerDay = secondsPerMin * minsPerHour * hoursPerDay;
document.write('There are ' + secondsPerDay + ' seconds in a day. ');
var yearsAlive = 40;
var secondsAlive = yearsAlive * secondsPerMin * minsPerHour * hoursPerDay;
document.write("I've been alive for more than " + secondsAlive + " seconds!");

How does it look?

Cheers

Sean

5 Answers

Ted Sumner
Ted Sumner
Courses Plus Student 17,967 Points

You have it down.

Chandler Tayek
Chandler Tayek
5,513 Points
Chandler Tayek
Chandler Tayek
5,513 Points

Almost got it! You got the number of seconds that a 40 day old baby would be. You need to convert days to years.

Fix to your code:

var secondsPerMin = 60;
var minsPerHour = 60;
var hoursPerDay = 24;
var daysPerWeek = 7;
var weeksPerYear = 52;
var secondsPerDay = secondsPerMin * minsPerHour * hoursPerDay;
document.write('There are ' + secondsPerDay + ' seconds in a day. ');
var yearsAlive = 40;
var secondsAlive = yearsAlive * secondsPerMin * minsPerHour * hoursPerDay * daysPerWeek * weeksPerYear;
//                           //multiplay by the number of days in a year-^--------days in a year------^
document.write("I've been alive for more than " + secondsAlive + " seconds!");

My solution:

var secondsPerMin = 60;
var minsPerHour = 60;
var hoursPerDay = 24;
var daysPerWeek = 7;
var weeksPerYear = 52;
var secondsPerDay = secondsPerMin * minsPerHour * hoursPerDay;
document.write('There are ' + secondsPerDay + ' seconds in a day. ');
var yearsAlive = 40;
var secondsAlive = secondsPerDay * daysPerWeek * weeksPerYear * yearsAlive;
document.write('I have been alive for more than ' + secondsAlive + ' seconds.');

Hope this was helpful!

Sean Flanagan
Sean Flanagan
33,235 Points
Sean Flanagan
Sean Flanagan
33,235 Points

Hi. Sorry for the late reply.

Here's what I've done, starting with the HTML:

<!DOCTYPE html>
<html lang="en">
<head>
  <meta charset="utf-8">
  <link rel="stylesheet" href="css/main.css">
  <title>Time Calculator</title>
 </head>
<body>
  <div class="container">
  <h1>Time calculator</h1>
  <script src="scripts.js"></script>
  </div>
</body>
</html>

And now the JavaScript:

var secondsPerMin = 60;
var minsPerHour = 60;
var hoursPerDay = 24;
var daysPerWeek = 7;
var weeksPerYear = 52;
var secondsPerDay = secondsPerMin * minsPerHour * hoursPerDay;
document.write('There are ' + secondsPerDay + ' seconds in a day. ');
var yearsAlive = 40;
var secondsAlive = yearsAlive * secondsPerMin * minsPerHour * hoursPerDay * daysPerWeek * weeksPerYear;
//                           //multiplay by the number of days in a year-^--------days in a year------^
document.write("I've been alive for more than " + secondsAlive + " seconds!");

How's that?

Thanks. :-)

Ted Sumner
Ted Sumner
Courses Plus Student 17,967 Points

I would change the last equation to utilize the secondsPerDay variable that you created. The next step would be to have years alive be a user input. And you could have them enter a birth date, get the current date from the system, and return a much more accurate answer.

I might do that when I get back to working on my JavaScript skills (which are low).

Ted Sumner
PLUS
Ted Sumner
Courses Plus Student 17,967 Points
Ted Sumner
Ted Sumner
Courses Plus Student 17,967 Points

Your JS runs perfectly in my console. Looks great.

Ted Sumner
PLUS
Ted Sumner
Courses Plus Student 17,967 Points
Ted Sumner
Ted Sumner
Courses Plus Student 17,967 Points

You have it down.

Sean Flanagan
Sean Flanagan
33,235 Points
Sean Flanagan
Sean Flanagan
33,235 Points

A little extra:

var secondsPerMin = 60;
var minsPerHour = 60;
var hoursPerDay = 24;
var daysPerWeek = 7;
var weeksPerYear = 52;
var secondsPerDay = secondsPerMin * minsPerHour * hoursPerDay;
document.write('There are ' + secondsPerDay + ' seconds in a day. ');
var yearsAlive = 40;
var secondsAlive = yearsAlive * secondsPerMin * minsPerHour * hoursPerDay;
document.write("I've been alive for more than " + secondsAlive + " seconds! ");
var monthsPerYear = 12;
var monthsAlive = yearsAlive * monthsPerYear;
document.write("That's upwards of " + monthsAlive + " months! ");