Check it out in an example survey!
Add this survey to your account!
This will not work with Internet Explorer 8 or below, or with Offline links. This script can only be used once on a page.
To get started, you will need to edit your Text Element and add the following div tag to the beginning of the text:
And then close that tag at the end of the Text element using the following:
Once you've added the opening and closing div tags, you can format your Text Element as needed. Each line break is important because that's how the script is going to determine where the link to show More will appear.
In this example, we're going to have the More link appear after the first line breaks. This requires an extra break tag so that it will match up with the formatting of all the following paragraphs.
The only adjustment needed in this script is near the beginning with the var MaxLines =1; line. You can change the value of 1 to match the number of line breaks before the location you want it to show the More link. So, if you wanted to to have the More link appear after the second paragraph in the above image, you would change that line in the script to var MaxLines =4;
Make sure to save and test this solution before deploying it live, especially if you plan on using mobile devices as each device could handle this script differently.
Scripting and Other Custom Solutions
We’re always happy to help you debug any documented script that is used as is. That said, we do not have the resources to write scripts on demand or to debug a customized script.
If you have customization ideas that you haven't figured out how to tackle, we're happy to be a sounding board for Alchemer features and functionality ideas that might meet your needs. Beyond this, check out our Professional Services; these folks have the scripting chops to help you to achieve what you are looking for!