When the user clicks on the show/hide link, a function should be called to toggle between hiding and showing the description paragraph element. The paragraph should be displayed if it was hidden and it should be hidden if it was displayed ? Note: to show and hide an html element you should use CSS layout display property.

When the user clicks on the show/hide link, a function should be called to toggle between hiding and showing the description paragraph element. The paragraph should be displayed if it was hidden and it should be hidden if it was displayed ? Note: to show and hide an html element you should use CSS layout display property.

New Perspectives on HTML5, CSS3, and JavaScript

6th Edition

ISBN:9781305503922

Author:Patrick M. Carey

Publisher:Patrick M. Carey

Chapter5: Designing For The Mobile Web: Creating A Mobile Website For A Daycare Center

Section: Chapter Questions

Problem 1CP3

See similar textbooks

Similar questions

HTML/CSS: Below is the code and I need help in making sure the toggle switch along with the title at the top of the button to be aligned in the middle. Make sure to show the correct code and the screenshot of the output. Code: .toggle-switch { position: relative; display: inline-block; width: 60px; height: 34px; } .toggle-switch .switch-track { background-color: var(--mode-btn-bg); border-radius: 34px; display: block; height: 100%; width: 100%; position: absolute; transition: background-color 0.3s; } .toggle-switch .switch-thumb { background-color: var(--p-text); border-radius: 50%; width: 26px; height: 26px; position: absolute; top: 4px; left: 4px; transition: transform 0.3s, background-color 0.3s; } input[type="checkbox"]:checked+.toggle-switch .switch-track { margin: auto; background-color: var(--mode-btn-bg) } input[type="checkbox"]:checked+.toggle-switch .switch-thumb { transform: translateX(26px); } .toggle-switch+p::before {…
Open the HTML and JavaScript files provided as start up files (index.html and navigation.js). Then, run the application and notice that when you click on a link in the sidebar, the page is scrolled so the information for the speaker associated with that link is displayed. In other words, this application works even if JavaScript is disabled. In the JavaScript file, add an event handler for the ready event method. Then, within the function for that event handler, add jQuery code that hides the heading and article for all but the first speaker. Add an event handler for the click event of the <a> elements in the sidebar. Then, within the function for that event handler, add jQuery code that hides all the speaker information, gets the value of the href attribute of the link that was clicked, and then uses that value to display the heading and article for the speaker associated with that link.
By using the program below: Kindly Change the color of all elements with the class "colortext", to "red". <!DOCTYPE html> <html> <head> </head> <body> <h1>This is a Heading</h1> <p>This is a paragraph.</p> <p class="colortext">This is another paragraph.</p> <p class="colortext">This is also a paragraph.</p> </body> </html>
this is my menu- need to code jquery selector & .change handler so that when these are selected & image shows, i have done other things with the html, its just this i am stuck on- keep getting the same image for all 4 when i want a different image per option! <p>Please select a direction:<br/><select id="mydirection" name="direction"><option value="N">North</option><option value="S">South</option><option value="E">East</option><option value="W">West</option></select></p>
I need help with this, please. Thanks Develop an Expand/Collapse application using JQUERYIn this exercise, you’ll develop an application that displays the first paragraph of text for three topics and then lets the user click a link to expand or collapse the text for each topic.2. Review the HTML. Note that each topic consists of two div elements followed by an <a> element. Also, note that a class named “hide” is assigned to the second div element of each topic. Then, review the style rule for this class.3. In the JavaScript file, add an event handler for the ready() event method.4. Within the ready() event method, code an event handler for the click() event method of the <a> elements. This event handler should start by preventing the default action of the link and storing the clicked link in a constant. Then, it should use the toggleClass() method to add or remove the “hide” class from the div element above the link element that’s clicked depending on whether that class is…
Create a HTML and CSS file of the given picture. Ensure that the interface will satisfy the given picture.Note: Once view button was clicked, another html file will pop up as shown in 2nd picture.