Chore Door Project challenges

Language Help JavaScript
1

Help! I’m stuck at step 19 of this project ----> https://www.codecademy.com/paths/web-development/tracks/build-interactive-websites/modules/web-dev-interactive-websites/projects/chore-door. Also I went through all the questions asked before. I could find any solution.
In fact, I can’t get the door to open even going side by side with the instructor. I have the code bellow:

<html>
  <head>
    <title>Chore Door!</title>
    <link href="./style.css" rel="stylesheet" type="text/css">
    <link href="https://fonts.googleapis.com/css?family=Work+Sans" rel="stylesheet" type="text/css">
  </head>

  <body>
    <div class="door-row">
      <img id="door1" class="door-frame" src="https://s3.amazonaws.com/codecademy-content/projects/chore-door/images/closed_door.svg">
      <img id="door2" class="door-frame" src="https://s3.amazonaws.com/codecademy-content/projects/chore-door/images/closed_door.svg">
      <img id="door3" class="door-frame" src="https://s3.amazonaws.com/codecademy-content/projects/chore-door/images/closed_door.svg">
    </div>
<script type="text/javascript" src="script.js"></script>
  </body>

</html>

—>

body {
  background-color: #010165;
  margin: 0px;
}

.door-frame{
  cursor: pointer;
  padding: 10px;
}

let doorImage1 = document.getElementById('door1');
let doorImage2 = document.getElementById('door2');
let doorImage3 = document.getElementById('door3');

let botDoorPath = "https://s3.amazonaws.com/codecademy-content/projects/chore-door/images/robot.svg"
let beachDoorPath = "https://s3.amazonaws.com/codecademy-content/projects/chore-door/images/beach.svg"
let spaceDoorPath = "https://s3.amazonaws.com/codecademy-content/projects/chore-door/images/space.svg"

doorImage1.onclick = () => {
  doorImage1.src = botDoorPath; 
}
doorImage2.onclick () => {
  doorImage2.src=beachDoorPath;
}
doorImage3.onclick () => {
  doorImage3.src=spaceDoorPath;
}
2

using the console (f12, then console tab) can be really helpful, it can show errors. i get an error:

SyntaxError: invalid arrow-function arguments (parentheses around the arrow-function may help) script.js:12

meaning there is an error on line 12, do you see it? so your doorImage1.onClick doesn’t contain any syntax error, yet doorImage2 does, do you see any differences?

3

Yes I’ve got it now. I can’t beleive spending hours on this! I wish I should use this forum earlier.
Thank you very much. Especially about the use of console recommendation. I have to figure out how to use it.

4

This topic was automatically closed 3 days after the last reply. New replies are no longer allowed.