ZuoTi.Pro
Question

5. ///////////////////////////////////////////////// Using javascript Create a paragraph on your page that says “This isn’t even my...

5. ///////////////////////////////////////////////// Using javascript Create a paragraph on your page that says “This isn’t even my final form!” (

This isn’t even my final form!

). Add a JS mouseover event to that paragraph. When the paragraph has a mouse hovering over it, the text inside should change to “This is my second form!” (

This is my second form!

). Add one more event handler so that when that paragraph is double-clicked, the text will say “THIS is my final form!” (

THIS is my final form!

). To do this exercise, you’ll need one paragraph with the text I mentioned above. That paragraph should contain a unique id attribute value, so you can identify it. You’ll then add two separate event handlers (normally not good practice but do it for this assignment)…one will handle onmouseover and the other will handle ondblclick. Look at the onmouseover example provided in the class example for the syntax you’ll need. The “this” keyword will come in handy and you’ll need .innerHTML to change the text. Make sure to bold the words as I have done above. When you use innerHTML, you can place tags inside of the quotation marks and they’ll render as HTML in your page. Since you’re replacing the text of the paragraph, you don’t need to include that tag in your innerHTML declaration.

engineering   Computer-Science   
0 0
Add a comment Improve this question Transcribed image text
Next > < Previous
Sort answers by oldest

Homework Answers

Answer #1 
 <!DOCTYPE html> <html> <head> <title>Document</title> <script> /* java script code for events*/ function f1(x) { x.innerHTML="This is my second form!"; x.style.color="red"; } function f2(x) { x.innerHTML="This is my final form!"; x.style.color="blue"; } </script> </head> <center><body> <h1><u>PARAGRAPH</u></h1> <!--paragraph--> <b><p id='a' onclick="f1(this)" onmouseover="f2(this)" style="color:hotpink;">This isn’t even my final form!</p></b> </body></center> </html>

output:

0 0
Add a comment
Know the answer?
Add Answer to:
5. ///////////////////////////////////////////////// Using javascript Create a paragraph on your page that says “This isn’t even my...
Your Answer:

Post as a guest

Your Name:

What's your source?

Earn Coins

Coins can be redeemed for fabulous gifts.

Log In

Sign Up

Not the answer you're looking for? Ask your own homework help question. Our experts will answer your question WITHIN MINUTES for Free.
Similar Homework Help Questions

  • JAVA SOLUTION This lab has four parts: Create a window. Create 5 buttons in that window....

    JAVA SOLUTION This lab has four parts: Create a window. Create 5 buttons in that window. Create an event when a button is pushed. Create an event listener that will respond to the button being pushed event. Task 1 – Create a Window For Java: Please ensure that the following import statements are used: import javafx.application.Application; import javafx.stage.Stage; import javafx.scene.Scene; import javafx.scene.control.Button; import javafx.scene.layout.GridPane; import javafx.scene.text.Text; import javafx.event.EventHandler; import javafx.scene.input.MouseEvent; Next, ensure that there is a main method which is...

  • PLEASE HELP: EASY CODE. Using your template create a webpage that contains a div. Give the...

    PLEASE HELP: EASY CODE. Using your template create a webpage that contains a div. Give the body element the id of TOOscary. Give the div the id of ghost. At the bottom of the page (just before the closing body tag) insert a script element. In the script element insert an assignment statement to save the content of the webpage using the variable candy. Hint: candy= document.getElementById(‘TOOscary’).innerHTML; We want to save it so we can bring it back after we...

  • This is my code so far: <!DOCTYPE html> <html> <head> <title>JavaScript is fun</title> <meta charset="utf-8" />...

    This is my code so far: <!DOCTYPE html> <html> <head> <title>JavaScript is fun</title> <meta charset="utf-8" /> </head> <body> <script type ="text/javascript"> //declare a variable and store text in it var x = "JavaScript is fun"; //write the variable 5 times document.write(x + x + x + x + x); //store 5 as string in variable x x = "5"; //store 3 as string in variable y var y = "3"; //write the value x + y to the document document.write("<br>");...

  • Javascript to edit a HTML file. Where to begin? <!doctype html> <html>    <head>      <meta charset="utf-8">      <title>TODO:...

    Javascript to edit a HTML file. Where to begin? <!doctype html> <html>    <head>      <meta charset="utf-8">      <title>TODO: Change The Title</title>    </head>    <body>      <h1></h1>      <p>First paragraph.</p>      <p class="intro">Second <span>paragraph</span>.</p>      <button id="start">Start</button>      <main> </main>      <!--       Test 6: DOM Programming       You MAY consult the notes for week 7, but you MAY NOT discuss this test or       your code with any other students.  All work must be your own.       Instructions:              1. Put all solution code in a file named solution.js.  When you upload your          solution to...

  • given below are the project description and their Html and css files i need javascript according...

    given below are the project description and their Html and css files i need javascript according to the project and other files! WEB230 - JavaScript 1 Assignment 6b - Event Delegation Before starting, study the HTML and open it in a browser so that you understand the structure of the document. You will add functionality to perform several tasks in our shopping list app. Clicking the red "X" at the right of an item will delete that item. Clicking on...

  • Produce a web application using Javascript that contains each of the following elements. The application doesn't...

    Produce a web application using Javascript that contains each of the following elements. The application doesn't need to be picture-perfect -- rather, use this as your opportunity to show off the skills you've acquired in the last several weeks. Think of simple applications that you may find useful -- a sign up form, a checklist, etc. Your project can be submitted in one of two ways: a zipped file consisting of an HTML5 doc, JS document, and other assets a...

  • Can someone help fix this JAVASCRIPT code according to comment instructions javascriot code: window.addEventListener("click", () =>...

    Can someone help fix this JAVASCRIPT code according to comment instructions javascriot code: window.addEventListener("click", () => { console.log("You clicked?"); }); let button = document.querySelector("button"); button.addEventListener("click", () => { console.log("First Button clicked."); }); // How can we modify this so that it will occur when the 2nd button is clicked? // We need to use querySelectorAll which will produce a nodelist/array of all the buttons. Then we can reference which button we want to apply the click event using [] with...

  • JavaScript (Please debug this code) When a user enters a string in the input box, the...

    JavaScript (Please debug this code) When a user enters a string in the input box, the program is designed to add the string to an array. When the array reaches a certain length, the program displays all the users' entries in a list on the page. When you finish debugging, the user's entry in the input box should be cleared each time the submit button is clicked. Additionally, after five strings are submitted, the entire list of submitted strings should...

  • Create an HTML5 page that contains a form to collect the following data. The text in...

    Create an HTML5 page that contains a form to collect the following data. The text in bold indicates the id value that should be assigned to each html control: Product (drop down list) product – iPad, iPhone 6S, Galaxy 5S, Moto X, and so on Quantity (number) quantity Unit price (number) unit_price Discount (%)(number) discount_rate Date (date)   order_date First Name (text box)   first_name Last Name (text box)   last_name Payment type (drop down list)   payment_type – Visa, Master, Discover, Amex, and...

  • Must be car Themed My first JS-DOM color:red; text node!'); //creates 'This is a text node!'...

    Must be car Themed My first JS-DOM color:red; text node!'); //creates 'This is a text node!' color:blue; font-family: arial; Clicker Counter: 0 Interface should look something like this, but does not have to be one for one like this picture One of JavaScript's powers is to be able to interact with the DOM directly. You've seen this when using commands such as document.getElementById("idName'). This document allows you to search HTML for certain elements. It turns out that you can also...

ADVERTISEMENT
Free Homework Help App
Download From Google Play
Scan Your Homework
to Get Instant Free Answers
Need Online Homework Help?
Ask a Question
Get Answers For Free
Most questions answered within 3 hours.
ADVERTISEMENT
ADVERTISEMENT
ADVERTISEMENT