How fast are you going?
Well this was most definitely an interesting project for sure! I learned a few things through trial and error. I wanted to see if I could figure things out on my own again and then if I got stuck use Google to find the right answers.
One of the issues I ran into was the following. I originally had the following conditional statements in the following order:
For some reason when I had the "if", then "else if", then another "else if", and yet another "else" statement it would only read the "if" condition and the first "else if" statement. It wouldn't even read any conditions after that, even if the other conditions were "True" and the first "if" and second "else if" were "False."
I'm still trying to figure out why it was ignoring all the other conditions after testing each of them. I decided, however, to do something a bit different. What if I were to instead separate both of the "else if" statements and get rid of the "else" statement? The "are_you_speeding" variable from the user prompt will remain the same so nothing would technically be changing. I decided to try it out and voila! It actually worked!
Another thing that also happened was that the images that corresponded with the user prompt wouldn't load! The reason I was having a hard time was because when I was researching the "innerHTML" property I knew how to include the corresponding text based on the user input from the prompt. But I had no idea how to add an image to the "innerHTML" property.
So I started to experiment to see if I could write the same conditional statements in the same way like I had done but this time instead of adding the text, like for example, "You are driving at 85 miles an hour! You are speeding. Slow down!" I would instead add an image to the "innerHTML" statement.
As you can see, if I followed the "innerHTML" exactly you'll notice there are no "< >" brackets. If I wanted to add an image I would also have to be extremely careful with the quotation marks since the "src" attribute already contains double quotation marks. I also added a new placeholder for my html div as well. The text placeholder for my html div tag says "SpeedTest" and the image placeholder for my other html div tag says "SpeedPicture." I played around with all of this, testing and re-testing the browser to reflect the new changes from my text editor until it finally worked! Yay!
Since I created a simple speeding car game using some new elements I learned such as "innerHTML" and "document.getElementById" along with how to make conditional statements a little bit more interactive based on user input from the prompt window you know what that means right? It's time for the Woohoo Dance!