Today, I wanted to show you how Javascript can make websites more fun!
One way is by adding in a "Fortune Teller!"
To complete this task, the following JavaScript code will need to be pasted into the SCRIPT section of your Notepad file:
var answers = new Array(
"Without a doubt",
"Yes!",
"Probably so",
"It isn't likely",
"it's possible",
"Absolutely",
"Not a chance",
"Ask again",
"No",
"I doubt it",
"No Way"
);
function fortune() {
num = Math.round( (answers.length - 1) * Math.random());
return answers[num];
}
Note that everything above that is in quotation marks are the possible "responses" from your fortune teller! You CAN change the text within the quotation marks to say different things! Be creative!
Next, the following HTML code will be pasted into the BODY section of your Notepad file:
<center>
<form>
Your question: <input type=text name=question size=40>
<input type=button name=ask value="Ask" onClick="if (this.form.question.value!='') this.form.answer.value = fortune();"><br>
Your fortune teller says: <input type=text name=answer size=40>
</form>
</center>
Remember that where ever you paste in your HTML code is where it will appear on the site! So if you want it on the bottom of your website, paste it in at the end of your code! If you want it to appear above something else, paste the code in a different spot!
You are welcome to change your text around to have it say different things! Preview your site to see how it looks! If it isn't working correctly, erase what you did and try again!
When you are finished, continue to work on your HTML, CSS, and JavaScript to make it appear to your liking. :)
YOUR WEBSITE WILL BE A LARGE GRADE IN THIS CLASS SO EVERY TIME YOU FINISH ADDING IN THE NEW ITEM, MAKE SURE YOUR SITE IS UP TO DATE WITH EVERYTHING ELSE YOU ARE SUPPOSED TO HAVE. LOOK BACK TO PREVIOUS POSTS TO MAKE SURE ALL ITEMS ARE INCLUDED.
Below is an example of how your Notepad file should look:
One way is by adding in a "Fortune Teller!"
To complete this task, the following JavaScript code will need to be pasted into the SCRIPT section of your Notepad file:
var answers = new Array(
"Without a doubt",
"Yes!",
"Probably so",
"It isn't likely",
"it's possible",
"Absolutely",
"Not a chance",
"Ask again",
"No",
"I doubt it",
"No Way"
);
function fortune() {
num = Math.round( (answers.length - 1) * Math.random());
return answers[num];
}
Note that everything above that is in quotation marks are the possible "responses" from your fortune teller! You CAN change the text within the quotation marks to say different things! Be creative!
Next, the following HTML code will be pasted into the BODY section of your Notepad file:
<center>
<form>
Your question: <input type=text name=question size=40>
<input type=button name=ask value="Ask" onClick="if (this.form.question.value!='') this.form.answer.value = fortune();"><br>
Your fortune teller says: <input type=text name=answer size=40>
</form>
</center>
Remember that where ever you paste in your HTML code is where it will appear on the site! So if you want it on the bottom of your website, paste it in at the end of your code! If you want it to appear above something else, paste the code in a different spot!
You are welcome to change your text around to have it say different things! Preview your site to see how it looks! If it isn't working correctly, erase what you did and try again!
When you are finished, continue to work on your HTML, CSS, and JavaScript to make it appear to your liking. :)
YOUR WEBSITE WILL BE A LARGE GRADE IN THIS CLASS SO EVERY TIME YOU FINISH ADDING IN THE NEW ITEM, MAKE SURE YOUR SITE IS UP TO DATE WITH EVERYTHING ELSE YOU ARE SUPPOSED TO HAVE. LOOK BACK TO PREVIOUS POSTS TO MAKE SURE ALL ITEMS ARE INCLUDED.
Below is an example of how your Notepad file should look: