Question:
I have created a collapsible section on my website using the following tutorial: https://www.youtube.com/watch?v=5KvHNasoOT8&t=665
I did everything exactly as in the video and used the same code. However my plus and minus buttons to expand the collapsible section don’t work. I can expand the section by clicking anywhere on the collapsible button but the actual plus and minus sign. When I click on the plus and minus nothing happens.
Product:
Wix Website Editor
What are you trying to achieve:
I want the plus and minus buttons to expand and claps the section when clicking on them.
Additional information:
Here is the code I used:
$w.onReady(function () {
$w(‘#questionOneCollapseButton’).onClick(() => {
toggleBox($w(‘#questionOneCollapsibleStrip’), $w(‘#questionOnePlusSign’),$w(‘#questionOneMinusSign’));
});
$w(‘#questionTwoCollapseButton’).onClick(() => {
toggleBox($w(‘#questionTwoCollapsibleStrip’), $w(‘#questionTwoPlusSign’),$w(‘#questionTwoMinusSign’));
});
$w(‘#questionThreeCollapseButton’).onClick(() => {
toggleBox($w(‘#questionThreeCollapsibleStrip’), $w(‘#questionThreePlusSign’),$w(‘#questionThreeMinusSign’));
});
$w(‘#questionFourCollapseButton’).onClick(() => {
toggleBox($w(‘#questionFourCollapsibleStrip’), $w(‘#questionFourPlusSign’),$w(‘#questionFourMinusSign’));
});
$w(‘#questionFiveCollapseButton’).onClick(() => {
toggleBox($w(‘#questionFiveCollapsibleStrip’), $w(‘#questionFivePlusSign’),$w(‘#questionFiveMinusSign’));
});
});
function toggleBox(boxElement, plusSign, minusSign) {
const isCollapsed = boxElement.collapsed;
if (isCollapsed) {
plusSign.hide();
minusSign.show();
boxElement.expand();
} else {
minusSign.hide();
plusSign.show();
boxElement.collapse();
}
}
Thanks in advance for any help! I am not experienced at all, YouTube tutorials and this forum is all I have