PHP Classes

File: assets/js/functions.js

Recommend this page to a friend!
  Classes of Adeleye Ayodeji   WordPress FAQ Plugin Block Element   assets/js/functions.js   Download  
File: assets/js/functions.js
Role: Auxiliary data
Content type: text/plain
Description: Auxiliary data
Class: WordPress FAQ Plugin Block Element
Show frequently asked questions in WordPress pages
Author: By
Last change:
Date: 8 months ago
Size: 1,594 bytes
 

Contents

Class file image Download
/** * Toggle accordion * @author Adeleye Ayodeji * @version 1.0.0 */ class AdeleyeAyodejiFAQBlocks { constructor() { //init on dom ready window.addEventListener("DOMContentLoaded", () => { //find .faq-block-element-for-wp-frontend this.parentElem = document.querySelector( ".faq-block-element-for-wp-frontend" ); //if found if (this.parentElem) { //find .accordion-item button this.faqBlocks = this.parentElem.querySelectorAll( ".accordion-item button" ); //loop through each this.faqBlocks.forEach((faqBlock) => { //add click event faqBlock.addEventListener("click", (e) => { //prevent default e.preventDefault(); //toggle accordion item open/close this.toggleAccordion(faqBlock); }); }); } }); } /** * Toggle accordion * @param {HTMLElement} element */ toggleAccordion(element) { //get all accordion items let items = this.faqBlocks; //get current accordion item toggle state const itemToggle = element.getAttribute("aria-expanded"); //loop through each accordion item for (let i = 0; i < items.length; i++) { //close all accordion items items[i].setAttribute("aria-expanded", "false"); } //if current accordion item is closed if (itemToggle == "false") { //open current accordion item toggle element.setAttribute("aria-expanded", "true"); } } } //init class and run on dom ready new AdeleyeAyodejiFAQBlocks();