Storyline iframe problem in mobile & tablet

Mar 12, 2015

We have a course in which we embed several storyline iframes.

In the desktop version everything works fine.

In the mobile & tablet version (web application, not native app), however, some of them show up, and some don't. We don’t know what differentiates them, since both the player and the publishing process are identical in all the storylines.

For example, in this page, the first storyline shows up fine (that's the one that shows the contents immediately), and the second isn't displayed correctly, and only shows a play button:

the first storyline shows up fine (that

 

After clicking the PLAY button, the file changes its size and doesn’t spread the whole width of the page like it should:

After clicking the PLAY button, the file changes its size and doesn’t spread the whole width of the page like it should

The only difference we noticed is in the attached JavaScript file (storyline_compiled_js) located in the mobile folder of each storyline.

We don’t know how this file is created, and merely changing it in the folder belonging to the incorrectly displayed storyline, so it's identical to the correctly displayed storyline, doesn’t help.

We also attached 2 open files:

SPORT which doesn't display correctly, and Electronics which does.


10 Replies
Ashley Terwilliger-Pollard

Hi Lea,

Thanks for sharing the files here and I took a look and saw all the same set up in both files so it seems the Storyline files are ok. I can't speak to how you've included it within the iFrame though - but I do know that when you embed a published course in an iFrame, the iFrame takes control of the content's placement. Depending on how the iFrame behaves, content might appear to be misaligned, cut off, or even have scroll bars. If you experience these symptoms, please contact your server administrator for assistance or look into the iFrame coding you created. 

Lea Cohen

Hi Ashley

Thanks for you reply.

Regarding the iframe - all of our iframes are defined the same way:

<iframe width="630px" height="480px" frameborder="0" scrolling="no" src="http://nano.animations.ort.org.il/Electronics_Comics_1410/story.html"></iframe>
<iframe width="600px" height="480px" frameborder="0" scrolling="no" src="http://nano.animations.ort.org.il/Electronics_1410/story.html"></iframe>

So it doesn't seem to me that the iframe definitions are responsible for the differences.

 

This discussion is closed. You can start a new discussion or contact Articulate Support.