Expand and collapse strip

Ask the community
,
1

Hi,
I have a button named “See More Transformations”
This button is above a strip on my page.
The button has a ‘+’ and a ‘-’ button.
When someone clicks on the “+” , the strip expands and when they click on the “-”, the strip collapses back in.

$w.onReady(function () {
    $w('#SeeMoreCollapseButton').onClick(() => {
        togglebox($w('#SeeMoreCollapsibleStrip'), $w('#SeeMorePlusSign'), $w('#SeeMoreMinusSign'));
    });
});

function togglebox(boxElement, plusSign, minusSign) {
    const iscollapsed = boxElement.collapsed;
    if (iscollapsed) {
        plusSign.hide();
        minusSign.show();
        boxElement.expand();
    } else {
        minusSign.hide();
        plusSign.show();
        boxElement.collapse();
    }
}

My question is:

When I click the “-” option to collapse the strip, it works. But, it leaves a whole lot of empty space above the footer. How can this be fixed?

2

Are you collapsing the strip? Or an element within the strip?

If you collapse the strip it should remove any empty space, whereas collapsing and element within the strip will hide that element but leave the size of the strip as blank

3

Are you collapsing the strip? Or an element within the strip?

If you collapse the strip it should remove any empty space, whereas collapsing and element within the strip will hide that element but leave the size of the strip as blank space

4

Hi Preston! I am collapsing the complete strip, and not just the elements.
Shall I share the link to the page, so you could take a look and suggest?