Hi guys,
i need your help to solve the following issue:
I have a long text that is shown a part of it and there is a button under called “Continue reading”.
The code that i have used is the following:
let fullText ; // variable to hold the full text
let shortText ; // variable to hold the short version of the text
$w . onReady ( function () {
// how many characters to include in the shortened version
const shortTextLength = 400 ;
// read the full text and store it in the fullText variable
fullText = $w ( “#text6” ). 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 ( “#text6” ). text = shortText ;
});
/**
- Adds an event handler that runs when the element is clicked.
- @param {$w.MouseEvent} event
*/
export function myButton_click ( event ) { //make sure you have added the onClick event in properties
// display the full text
$w ( “#text6” ). text = fullText ;
// collapse the button
$w ( “#myButton” ). collapse ();
}
It works pretty well, but the problem is that there is a big gap under the Button “Continue reading” and i cannot place the button as a stack element , so the height of the section would be adjusted automatically. The block of the text is one. What would you suggest me to do? I am not experienced at coding at all.
Thanks a lot. Any help would be app
reciated.
