Scroll bar problem in IE

Sorry that's happening, Santhosh! We're seeing the same thing. Specifically, there is extra space at the end of scrolling panel content when the HTML5 output is viewed in Internet Explorer and Edge. We've got this reported for Storyline 360--is that the version you're using?

Yes, Storyline 360

Thanks for confirming that, Santhosh. I'll tag this thread to be updated as soon as we hear more information. You'll be notified immediately since you're subscribed to this thread. 

My team is experiencing this as well in Storyline 3. The only browser we can use in the agency I work for is IE.

Thanks Jeremy for chiming in here too - we'll keep you posted once we've got more information from our team. 

We have latest version of storyline 3 but still facing same issue on ie. is there any solution? ??

Hello Ramjeet - Looks like I just responded to a similar question here.

You have to update some codes in "mobile/player.css" file.

Add "display: none !important;" on ".modalfence" Class.

I hope this will help. :) 

ANy fix to this yet? Seeing it and my learners can't go to Chrome...

Good morning, Kai!

That extra space seen at the bottom of scrolling panels is a result of an issue in Internet Explorer and Microsoft Edge, not Storyline. Here's a helpful resource on this bug:

• HTML5 Scrolling Panels Have Unexpected Blank Spaces in Internet Explorer and Microsoft Edge

Until Microsoft fixes the problem, you can avoid it by:

• Switching to another HTML5 browser, such as Chrome or Firefox
• Shortening the text, so it will not overlap the scrolling panel
• Though code is outside our comfort zone, here's a community example that modifies the CSS: Arkadiusz's Code

Thanks Katie. Tried the code fix but wasn't able to resolve it in that way either...

Chung Kai Lam, MBA
Senior Learning Technologist
Pronouns: He, him, his, himself
Human Resources | OD & Learning
Mobile: 857-205-6890
clam5@partners.org
brighamandwomens.org

The information in this e-mail is intended only for the person to whom it is
addressed. If you believe this e-mail was sent to you in error and the e-mail
contains patient information, please contact the Partners Compliance HelpLine at
http://www.partners.org/complianceline . If the e-mail was sent to you in error
but does not contain patient information, please contact the sender and properly
dispose of the e-mail.

Oh no, Kai!

I'm sorry to hear that solution didn't work. Have you had a chance to try Steven's modified code?

I put the following code in a JavaScript trigger that executes when the page or layer containing the scrolling panel starts:

//jQuery/css so Scrolling Panel displays correctly in IE and Edge

$(".scrollarea-area svg").css({"position": "relative", "display": "block", "overflow": "hidden", "pointer-events": "none"});

Although code is outside our comfort zone, we're happy to see what you set up so far and recommend any tailored suggestions on where to go next. You can always share your file with our Support team through this private upload link.

By the way, it looks like you may have replied by email where your contact info came through to the public forum. Feel free to edit it out through this link! 

Dear All,

Myself I have found the solution for this. 

Go to html5 folder > lib folder > stylesheets folder > main.css

change the below css overflow:scroll

slide-object svg{position:relative;display:block;overflow:visible;pointer-events:none}

Please change visbile to overflow:scroll

This will work