COLLAPSE not working While EXPAND works Fine

I was offered ‘solutions’ regarding an &nbsp issue and the solution triggered the Collapse feature to fail. I am following the 70 pixels or less rule. I simply do not want the large gap between the button and image below the text. Show Less and Show More works perfectly. Thanks.

Current Code:

let fullText; // variable to hold the full text
let shortText; // variable to hold the short version of the text
// For full API documentation, including code examples, visit Velo API Reference - Wix.com
$w.onReady( function () {
// how many characters to include in the shortened version
const shortTextLength = 252;
// read the full text and store it in the fullText variable
fullText = $w(“#text21”).text;
// grab the number of characters defined in shortTextLength and store them in the shortText variable
shortText = fullText.substr(0, shortTextLength) + “…”;
// set the contents of the text element to be the short text
$w(“#text21”).text = shortText;
//TODO: write your page related code here…
});

export function button1_click(event, $w) {
// check the contents of the text element
if ($w(“#text21”).text === shortText) {
// if currently displaying short text, display the full text
$w(“#text21”).text = fullText;
$w(“#button1”).label = “Show Less”;
} else {
// if currently displaying full text, display the short text
$w(“#text21”).text = shortText;
$w(“#button1”).label = “Show More”;
}
//Add your code for this event here:
}

Also, I just added a second button to link the reader to a hidden page called ‘Full Text’. I am not clear what is required so the behavior is the same for both buttons.

This is the full extent of the text on this page. Only the first short paragraph shows before pressing ‘Show More’.

I also had some bugs in the collapse yesterday and today. I don’t know if there is a bug because the ordinary 10/70 rule does not seem to work as it should.

Hi,
I saw the code you’ve pasted above and you haven’t used the collapse function…
I recommend following all the steps mentioned here .

Best,
Tal.

1 Like

Tal, I followed the instructions step by step on the page you linked. I posted here after I had already completed that and reviewed it three times. Perhaps the instructions are wrong?

Tal, this is the instruction: “As the text grows and shrinks, the button will automatically move up and down the page. See this article for more information.” That is the same article that you linked me to. Unless I’m blind it merely described the 70/10 rule. No additional code required. Is something missing?

Clicking on the forst line which states, “You can use code to make page elements collapse or expand. (Collapsing an element essentially sets its height to 0.),” takes me to an API page with code samples though no clear instruction on which to use nor where to place them. I have tried 6 different code samples with no success.

If Wix’s policy is ‘figure it out yourself’ please say so and spare the politeness. I NEED a solution and perhaps will abandon this detail, this page or Wix altogther if I cannot sort this out. I have been asking this question for 9 days now!

John Gil, you are correct, not sure why the moderator linked us to the same instructions that caused the issue…

John Jackson, this cost me many many hours of time. One of their programmers did it for me eventually, (after a couple of weeks of my prodding), and I know not how. The arrogance was extremely annoying. I am not a coder, but I can easily follow clear and accurate instructions, that were NOT provided. I would steer clear of this if I were you. On a positive note, this is a feature I asked for perhaps 4-5 years ago. It was finally provided.