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
Dennis Klarenbeek
17,168 PointsThe JavaScript outcome won't write into the index.html preview
Can somebody help me to succeed in this example? Now there's nothing to see in the preview.
'''var SecondsPerMin = 60; var MinutesPerHour = 60; var HourPerDay = 24; var DaysPerWeek = 7; var WeeksPerYear = 52; var MyAge = 25; var SecondsAge = SecondsPerMin * MinutesPerHour * HourPerDay * DaysPerWeek * WeeksPerYear * MyAge; document.write('I am at least' + SecondsAge + ' alive.');'''
11 Answers
Max Kutner
7,595 PointsI think so but am not certain. For some reason, when I repost your code here, it isn't turning up in the window. I would try downloading the workspace again and starting from scratch. Remember if you post your script directly in the HTML to nest it only in the <head> or <body> tags (preferably the body toward the end).
If any of this helped, please don't forget to mark the responses as answers or best answers should it eventually work out for you.
Cheers, Max
Max Kutner
7,595 PointsHi, Dennis!
I just punched your code into my workspace and it did print out fine except there is a space needed after 'least' and a ' seconds' before 'alive.'
Maybe try closing the workspace and re-opening with that code. Also, are the script tags alright in your HTML?
Max
louiecamacho
10,980 PointsI sometimes get this issue where the workspaces doesn't preview what I've just coded.
So here's the situation: I would type out the code as instructed, then save and click on the preview to see the results and I get a blank page. It's not until now that I discovered if you clear your browser cache, it fixes itself.
I'm on Safari right now and I held down Shift + clicked on the refresh button and my code suddenly works!
Dennis Klarenbeek
17,168 PointsMax,
Thank you for the quick reply. I already saw that mistake but also then there is no outcome:
var secondsPerMin = 60; var minutesPerHour = 60; var hoursPerDay = 24; var daysPerWeek = 7; var weeksPerYear = 52; var myAge = 25; var secondsAge = secondsPerMin * minutesPerHour * hoursPerDay * daysPerWeek * weeksPerYear * myAge; document.write('I am at least' + secondsAge + ' alive.');
Dennis Klarenbeek
17,168 PointsHi Max,
Very strange, I never get an outcome from the Workspaces. Maybe some error in the browser....
Max Kutner
7,595 PointsCould you post your code, both HTML and JS? Also, what is appearing when you preview it? Are you getting a new window in the browser or an error message?
Dennis Klarenbeek
17,168 PointsIt shows only the H1 and the border etc.
[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; }
[JS]
var secondsPerMin = 60; var minutesPerHour = 60; var hourPerDay = 24; var daysPerWeek = 7; var weeksPerYear = 52; var myAge = 25; var secondsAge = secondsPerMin * minutesPerHour * hourPerDay * daysPerWeek * weeksPerYear * myAge; document.write('I am at least' + secondsAge + ' alive.');
Max Kutner
7,595 PointsCould you paste the workspace markup code (HTML)?
Also, your .js is named 'scripts.js'?
Dennis Klarenbeek
17,168 PointsHow can I do that?
Max Kutner
7,595 PointsJust copy and paste everything in the index.html file.
Dennis Klarenbeek
17,168 PointsLike this?
```<!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> var secondsPerMin = 60; var minutesPerHour = 60; var hourPerDay = 24; var daysPerWeek = 7; var weeksPerYear = 52; var myAge = 25; var secondsAge = secondsPerMin * minutesPerHour * hourPerDay * daysPerWeek * weeksPerYear * myAge; document.write('I am at least' + secondsAge + ' alive.'); </script> </div> </body> </html>
Max Kutner
7,595 PointsYes!
I believe I've got it.
You need to take your script out of the container div and put it simply in the body like so:
<!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> </div> <script> var secondsPerMin = 60; var minutesPerHour = 60; var hourPerDay = 24; var daysPerWeek = 7; var weeksPerYear = 52; var myAge = 25; var secondsAge = secondsPerMin * minutesPerHour * hourPerDay * daysPerWeek * weeksPerYear * myAge; document.write('I am at least' + secondsAge + ' alive.'); </script></body> </html>
Dennis Klarenbeek
17,168 PointsOke but I don't see an outcome in your answer right now
Max Kutner
7,595 PointsTry just getting rid of the div altogether:
<!DOCTYPE html> <html lang="en"> <head> <meta charset="utf-8"> <link rel="stylesheet" href="css/main.css"> <title>Time Calculator</title> </head> <body> <h1>Time calculator</h1> <script> var secondsPerMin = 60; var minutesPerHour = 60; var hourPerDay = 24; var daysPerWeek = 7; var weeksPerYear = 52; var myAge = 25; var secondsAge = secondsPerMin * minutesPerHour * hourPerDay * daysPerWeek * weeksPerYear * myAge; document.write('I am at least' + secondsAge + ' alive.'); </script> </body> </html>
Dennis Klarenbeek
17,168 PointsThank you for your help but I can't get any result. I don't know how it's possible but it's very irritating. In the meantime deinstalled en reinstalled the Chrome browser but without any result.
Can I also send a picture inside this discussion?
Max Kutner
7,595 PointsMax Kutner
7,595 PointsYou can't capitalize the first word of variable names. I.E. SecondsPerMin needs to secondsPerMin and so on.
Hope this helps!
Max