I have a page that is entirely covered by strips from the top of the page down to the footer. The top-most strip is at y = 0, that’s the very top of the page. The top of every strip after that one touches the bottom of the previous strip. The bottom of the last strip touches the top of the page footer.
On some strips, there is a textbox with a click event that expands the strip below it if it is collapsed, and collapses it otherwise. Those collapsable/expandable strips start out collapsed and there is a huge gap at the bottom of the page. Endless scrolling to get through it. Obviously, the page height is not adjusting accordingly, which it should according to this article from Wix:
“When elements collapse, expand, and grow, the rules governing the footer are identical to those discussed above. In other words, if the gap between the last element on the page and the footer is within 70 pixels, collapsing the last element causes the footer to move up and the page size to shrink.”
Get that last part? The page size is supposed to shrink. So why is it that on the page I described above, on which there are zero pixels between one strip and the other (way under 70), I’m not observing the behavior described in the article?
As far as I know, the page size changes with expand/collapse coding. Its perfectly working in my site, but I don’t know how it happen not to work with you. Perhaps there might be some errors in the coding or page setup!!
Steve, here’s how it’s set up: Strips are organized in sets. The first strip in the set is not collapsible. It contains two textboxes; one that expands the strips below it in the set and one that collapses them. Each set can contain up to 3 collapsible strips.
The textboxes are grouped with an arrow shape, so they are called grpViewCoursesX and grpHideCoursesX, where X is an index that identifies the set. The collapsible strips are called stripCoursesYX, where X is the same index as for the group just described, and Y is a letter A - C identifying the particular collapsible strip in the set. There can be up to 3 as it so happens right now.
====
NonCollapsibleStrip1
[txtViewCourses1] [txtHideCourses1]
stripCoursesA1 (collapsible )
stripCoursesB1 (collapsible )
NonCollapsibleStrip2
[txtViewCourses2] [txtHideCourses2]
stripCoursesA2 (collapsible )
stripCoursesB2 (collapsible )
stripCoursesC2 (collapsible )
etc for a total of 7 sets
This function does the expanding and collapsing; it is called in the click events of the textboxes:
function toggleFold(index, collapseAll) {
let $stripCoursesA = $w('#stripCoursesA' + index);
let $stripCoursesB = $w('#stripCoursesB' + index);
let $stripCoursesC = $w('#stripCoursesC' + index);
let $grpViewCourses = $w('#grpViewCourses' + index);
let $grpHideCourses = $w('#grpHideCourses' + index);
// toggle the fold at the index
if ($stripCoursesA.collapsed) {
$stripCoursesA.expand();
if (index <= 5) {
$stripCoursesB.expand();
}
if (index === 4) {
$stripCoursesC.expand();
}
$grpViewCourses.hide();
$grpHideCourses.show();
}
else {
$stripCoursesA.collapse();
if (index <= 5) {
$stripCoursesB.collapse();
}
if (index === 4) {
$stripCoursesC.collapse();
}
$grpViewCourses.show();
$grpHideCourses.hide();
}
}
Not sure how this is a code issue, though, Steve, because the symptom (huge gap at bottom of page) is observed immediately, before the user has had a chance to expand anything. All collapsible strips are set to “Collapsed on load” in their properties.
Marcia, thank you!!! I understand it now. I created a new page and put an empty strip on it which I pushed down against the footer. If you move the footer that way, indirectly, by adjusting other elements, the page size will shrink as it should. It seems you just can’t touch the footer handle. Thanks again!
As I contemplate the recent past, I imagine a tooltip on the footer handle. "Manually changing the page height will make the page height static learn more ", or just, “Touch this and your collapse stuff will get weird.” …Wix? An area for improvement?
… but if the container is a strip, I can’t make it work. I’m using a container box instead of the empty strip I described above. I can’t make it work. Anyone have a workaround for when the container is a strip?
This isn’t a feature, definitely a bug. If you need to collapse strips, then make sure you place the strips where you want them with either your shift and arrow keys, or else the X and Y inputs in the toolbar. The problem is in the way the editor handles these methods vs clicking and dragging, where clicking and dragging will actively change the height of the page itself, and so it won’t collapse that gap because it assumes you meant for the page to be that many pixels tall.
So, I’m collapsing and expanding strips within a page container without a problem at this point; the page resizes accordingly. But now I need to do something similar in a strip. I need the strip to resize accordingly when it, and not the page, is the container. Different situation.
@[peter] Hi my question about code was related to the fact that this is a code forum not a Wix editor one ;-). Also if you share a link to the page some of us can observe the problem and try to diagnose it for you using developer tools.
Steve, yeah, well, let me tell you how much I care that this is a coding forum LOL. I originally asked for help with this issue from the editor folks–they sent me here! (Head tilted back roaring with laughter). Fortunately, one person above was more interested in helping than where the help was being provided, so I ended up solving an editor issue in a coding forum! Oh my! And today there is one more happy person on this planet! Ah the sloppy web humanity weaves… I wouldn’t lose too much sleep over it, my friend.
BTW, the code was shared in response to your original inquiry above in my reply to you.
I’m not sure if this will resolve your issue, but I read in another post that double clicking the handle on your footer solves the problem. I dont have this issue myself, but its worth a shot i guess.
