Collapsible section buttons (plus and minus) do not work

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 :wink:

Ok …. try my tutorial instead …

An oldie from 2018, but the original :wink: ….

You can use the onClick bit of your existing code instead of using the event panel code that I use from back then.

It’s the “inside” part of the code that is easier to read and understand.

Let me know if that works out better for you.

#CodeQueen

Hye, thank you so much for your answer and help! It works now :partying_face: :partying_face: :partying_face: :partying_face: Much appiciated!

1 Like