Having Problems with Toggle

Hi, I’ve added a toggle to my site and I’ve got it all working, BUT, now I’m having problems with the page length and loads of extra white space as well as no space between the bottom of the toggle and the next strip (video below). Any suggestions would be so appreciated! THANK YOU

Here you can see on the Zoom Out Mode in Editor that there should be space between and there is no extra white space before the footer.

Toggle Code (it works)


function toggleFold(index) {
 let $fold = $w('#fold' + index);
 let $arrowDown = $w('#arrowDown' + index);
 let $arrowRight = $w('#arrowRight' + index);
 // toggle the fold at the index
 if ($fold.collapsed) {
        $fold.expand();
        $arrowDown.show();
        $arrowRight.hide();
    }
 else {
        $fold.collapse();
        $arrowDown.hide();
        $arrowRight.show();
    }
 // collapse the other folds
    [1,2,3,4,5]
        .filter(idx => idx !== index)
        .forEach(idx => {
            $w('#fold' + idx).collapse();
            $w('#arrowDown' + idx).hide();
            $w('#arrowRight' + idx).show();
        })
}

export function headerBox1_onClick(event) {
    toggleFold(1);
}

export function headerBox2_onClick(event) {
    toggleFold(2);
}

export function headerBox3_onClick(event) {
    toggleFold(3);
}

export function headerBox4_onClick(event) {
    toggleFold(4);
}

export function headerBox5_onClick(event) {
    toggleFold(5)
}

Site Preview: https://hcollins19.wixsite.com/be-thriving/about

Hi hcollins,
Double-clicking the footer handle should remove the gap.

Also, there’s a typo in your contact email—it’s missing the “r” in thriving. :slight_smile:

Thanks for the typo catch! The site is still a work in progress. Unfortunately, in the editor there is no space between the footer and the last strip, but there is in preview, so the footer handle doesn’t help