HTML page jumps to storyline embedded in iframe

I came across this exact problem when embedding storyline 1 into iframes in a D2L course: https://community.articulate.com/discussions/articulate-storyline/embedding-story-html-into-another-html-file-via-iframe-jumping

When the page opens, it loads for a second and then jumps to the storyline iframe. We would like people to get to the storyline from the top of the page. Has a solution been found that doesn't require going into the story.js file? I would more happily edit the html code for the page itself than the story.js file.

5 Replies
Ashley Terwilliger

Hi Katie, 

If you use an iFrame to embed a published Articulate Storyline course into a web page, you may find that the web page automatically scrolls down to the iFrame when it's viewed in Internet Explorer or Firefox.

This results from a browser conflict with code that allows keyboard commands to function as soon as a page loads. Use any of the following options to avoid this behavior. 

Katie Venit

Does SL2 have a fix for this? 

In order to get it to work, my coworker had to FTP that particular story.js file separately. So every time we make a change to a storyline and republish, we have to redo that commenting out and then FTP that one file separately. This is not sustainable for our purposes, unfortunately. (the other two solutions of having the SL positioned at the top of the page or not using IE or firefox don't work for us.)

Ashley Terwilliger

Hi Katie, 

That article I linked to was in regards to SL2, and as I understand it, the iFrame is the element taking control here so there isn't a way to change how it's going to do so from within the Storyline file, but hopefully someone in the community has created a way to do what you're looking. 

Justin Grenier

Good Afternoon, Katie.

You are correct in deducing that this behavior is specific to Storyline.  When Storyline grabs the browser's focus (so that learners can immediately use the keyboard on Slide 1 without clicking inside the IFrame), some browsers automatically scroll to the IFrame.

The methods in this article are the only known workarounds for this behavior, although we certainly welcome all Feature Requests.

Have a great day!