FAQ repeater with dynamic height

Ask the community
,
1

I am trying to create an accordion style FAQ with dynamic heights to the different answers, since some are one sentence, and others are 2 paragraphs.

Everything is working except for “container” (the containerbox), not adjusting to the dynamic height of the text in answertext. Please let me know if there’s anything you can think of to help the height adjust on desktop. For some reason, it automatically adjusts on mobile just fine.

Here is the layer situation:
#faqrepeater (Repeater)
├── #container (Box – Repeater Item Container)
│ ├── #collapsebutton (Button – Triggers Expand/Collapse)
│ ├── #plus (Text or Icon – Shows when collapsed)
│ ├── #minus (Text or Icon – Shows when expanded)
│ └── #answerbox (Box – Holds the answer text, collapsible)
│ └── #answertext (Text – The actual answer content)

Here is the code I am using:

$w.onReady(function () {
    $w("#faqrepeater").onItemReady(($item, itemData, index) => {
        console.log(`Item ${index} ready`);

        // Initially collapse the answer box and show only the plus sign
        $item("#answerbox").collapse();
        $item("#plus").show();
        $item("#minus").hide();

        // Function to toggle between collapse and expand
        $item("#collapsebutton").onClick(() => {
            if ($item("#answerbox").collapsed) {
                $item("#answerbox").expand();
                $item("#plus").hide();
                $item("#minus").show();
                console.log(`Expanding answer for item ${index}`);
            } else {
                $item("#answerbox").collapse();
                $item("#plus").show();
                $item("#minus").hide();
                console.log(`Collapsing answer for item ${index}`);
            }
        });
    });
});

I’m not sure which version of wix I am using, but I am using Velo.

2

Nevermind, figured it out!

For anyone searching for this in the future, I had to go to the toolbar and delete the height of the answerbox and the container, and then they became variable.