So there is a bunch of extra in my scroll panels that wasn't there while my training is in Storyline, only when I publish it to review, and I don't know how to make it go away.
It seems to me that this white extra space underneath the text in the scrolling panel has the same height as the text itself. Looks like the same number of lines of text you have in the text box is duplicated under the text as empty lines, which causes the white space.
The longer the text, more white space underneath.
The solution is therefore simple - split the text into separate text boxes, only couple of text lines each (one or two sentences, maybe one paragraph max.). Remember the last "paragraph" (at the very bottom) must have only one line of text, otherwise it creates the white space again.
This is good. We just had a client complaining about the extra space issue showing up. At least there is a temporary fix. Hooray for the forum! Thanks Jan.
Thanks Jan I too am having same issue with scroll bars. I tried this solution I broke the text into multiple boxes with 1-2 text lines in each box and only one line of text in the last box however it still displays with loads of unwanted space following the text. If anyone has had any success with overcoming this issue I would be so happy to hear what you did.
With jQuery gone, this solution won't work anymore. The issue is ultimately needing a property of "overflow:hidden" added to the text box in the scroll panel. I can see it fix in devtools when I add it to the inline style of the text box.
For those of us who have a huge amount of users that are on IE, You'd be surprised at the amount of tickets that come in that the panel is "missing some information" or "some of the information isn't showing."
it would be really helpful to fix, and should be low-hanging fruit. Thanks!
Why is it on Microsoft to issue a fix? Isn't Storyline supposed to run in those browsers? Why doesn't Articulate do the fix? IE was, and Edge now is the browser that a lot of corporate IT departments issue standard and REQUIRE users to use.
13 Replies
Hi there, Crystal. 🙂
Internet Explorer and Edge have some issues displaying scrolling panels with extra spaces in HTML5 output. You can read more about it here.
Until they release a fix, we recommend viewing HTML5 output in another supported browser, such as Chrome, Firefox or Safari.
I have found an overcome for this issue.
It seems to me that this white extra space underneath the text in the scrolling panel has the same height as the text itself. Looks like the same number of lines of text you have in the text box is duplicated under the text as empty lines, which causes the white space.
The longer the text, more white space underneath.
The solution is therefore simple - split the text into separate text boxes, only couple of text lines each (one or two sentences, maybe one paragraph max.). Remember the last "paragraph" (at the very bottom) must have only one line of text, otherwise it creates the white space again.
Hope this helps :)
This is good. We just had a client complaining about the extra space issue showing up. At least there is a temporary fix. Hooray for the forum! Thanks Jan.
Thanks Jan I too am having same issue with scroll bars. I tried this solution I broke the text into multiple boxes with 1-2 text lines in each box and only one line of text in the last box however it still displays with loads of unwanted space following the text. If anyone has had any success with overcoming this issue I would be so happy to hear what you did.
Quite old, but hope this helps. IE and Edge issues. To solve it:
Add a trigger >> "Execute Javascript" and past this code:
$(".scrollarea-area div").css("overflow", "hidden");
$(".base-layer div").css("overflow", "visible");
When: Timeline starts.
NOTE: Put this JavaScript code in the layers were you have scroll bars.
Confirmed. This works.
Had the same problem. This fixed it. Thank you, Nuno.
Articulate, might be a lead in fixing a known IE, Edge issue.
When I use this it kicks the text out of the scroll panel
Yeah, I'm with Phil on this. The code made the text come out. It's weird.
I'm having the same problem on tab notes in the storyline player, it happens on all browsers (including Chrome).
Any ideas to fix it?
Thanks, Nuno Cardoso, You solved my problem!
With jQuery gone, this solution won't work anymore. The issue is ultimately needing a property of "overflow:hidden" added to the text box in the scroll panel. I can see it fix in devtools when I add it to the inline style of the text box.
For those of us who have a huge amount of users that are on IE, You'd be surprised at the amount of tickets that come in that the panel is "missing some information" or "some of the information isn't showing."
it would be really helpful to fix, and should be low-hanging fruit. Thanks!
Save what you want to put in the scroll section as a picture and drop that in, that's how I have been doing it
This discussion is closed. You can start a new discussion or contact Articulate Support.