Forum Discussion
No scrollbar if textbox has alignment set to bottom
I'm embedding an AI chatbot solution into my storyline, and while I've managed to surpass so many hurdles, I'm stuck on one last thing.
To make it function like a chat, I have a textbox aligned to the bottom. This means new text appended to the variable make the text 'scroll up'. This works fine until the textbox is full - and while it keeps appending the text, no scroll bars appear.
If I set the alignment to 'top', then it works and I get scroll bars, but then I have the issue of not automatically scrolling down.
I feel like the scrollbars not appearing when alignment is set to bottom could be a bug? thoughts?
Hello DamianAndre-1da,
I suspect the reason why no scroll bars appear is that the text exists within the AI chatbot application and not inside a Storyline 360 element. Objects inside an input text box, for example, are detectable by Storyline 360, so it will know when to increase the space and add scroll bars if needed. Objects inside a third-party application have no interaction with Storyline 360, so there's no way for it to know if more space is required.
Feel free to share a copy of your project file here or in private by opening a support case so I can confirm if this is the case!
- NedimCommunity Member
Whether it's a bug or not, this is certainly unwanted or unexpected behavior and can be easily replicated. In this scenario, for some reason, the scrollbar has been given a hidden class, so it doesn't show. If the hidden class is removed, the scrollbar would indeed show, but the scrollbar button appears at the top, allowing you to scroll down only, even though the text is aligned to the bottom. This would typically expect you to scroll up to the top instead, or for the text to automatically scroll down as more content is added to the text box. I would suggest getting rid of the default Storyline scrollbar altogether and trying something else.
I suggest the following:
1. Align the text to the top
2. Inject the JavaScript below