Question: Please modify my the faqs.js file so my jQuery will operate properly with this toggle program . Program output is below the source code The
Please modify my the faqs.js file so my jQuery will operate properly with this toggle program.
Program output is below the source code
The FAQ applicatiion's source code is below:
index.html source code:
JavaScript FAQs
What is JavaScript?
JavaScript is a browser-based programming language
that makes web pages more responsive and saves round trips to the server.
What is jQuery?
jQuery is a library of the JavaScript functions that you're most likely
to need as you develop websites.
Why is jQuery becoming so popular?
Three reasons:
- It's free.
- It lets you get more done in less time.
- All of its functions are cross-browser compatible.
faqs.js source code
"use strict";
var $ = function (id) {
return document.getElementById(id);
};
$(function () {
//Add a click handler for "#faqs a" tag
var faqs = $("#faqs a").click(function () {
var h2 = $(this).parent();
var div = h2.next();
//JQuery method to hide and unhide tag
div.toggle();
//JQuery method to show + and - images by modifying the attributes
if (h2.attr("class")) {
h2.removeAttr("class");
} else {
h2.attr("class", "minus");
}
if (div.attr("class")) {
div.removeAttr("class")
} else {
div.attr("class", "open");
}
});
});
main.css source code:
* { margin: 0; padding: 0; } body { font-family: Verdana, Arial, Helvetica, sans-serif; font-size: 87.5%; width: 650px; margin: 0 auto; border: 3px solid blue; padding: 15px 25px; } h1 { font-size: 150%; } h2 { font-size: 120%; padding: .25em 0 .25em 25px; cursor: pointer; background: url(images/plus.png) no-repeat left center; } h2.minus { background: url(images/minus.png) no-repeat left center; } a { color: black; text-decoration: none; } a:focus, a:hover { color: blue; }
div { display: none; } div.open { display: block; } ul { padding-left: 45px; } li { padding-bottom: .25em; } p { padding-bottom: .25em; padding-left: 25px; }
Output:

FAQS ? file://home/amoeba2/Desktop/cheggandex.html# JavaScript FAQs - What is JavaScript? JavaScript is a browser-based programming language that makes web pages more responsive and saves round trips to the server + What is jQuery? +Why is jQuery becoming so popular
Step by Step Solution
There are 3 Steps involved in it
Get step-by-step solutions from verified subject matter experts
