Storyline 360 Embed vs. Opening in a New Window Behaviour on Mobile

Hey Everyone,

Until recently, I've always used an LMS that opened a new window where storyline was displayed. I've just started working with LearnDash, and I'm working on figuring out the best ways to display storyline content.

Ideally, I'd like to embed the content in an iframe for a "seamless" experience. This also allows the ability to use some solutions for automatically marking lessons complete.

Another option is adding a link to the lesson where the user clicks the link and the storyline content opens in the new window. I'd prefer embed option for the reasons noted above.

I've done some testing, and here's what I've experienced.

Link that opens in new window

The content displays great when the player is locked at the optimal size and when set to scale with browsers on both desktop and mobile. On mobile, it does not autoplay. There is a large play button, and when pressed, the player fills the mobile device's screen. This works great with no issues.

Embed into page

The embedded content was set to scale with the browser. This allows the content to scale and always be viewable. Works beautifully on desktop.

Now, here's the problem.

When viewing this method on a mobile, it displays the large play button on the player, however, the mobile player does not expand and fill the screen of the mobile device. This results in relatively poor experience as some content is not viewable and all of the display's real estate is not being taken advantage of.

So here's the question.

Is it possible to somehow force the player to expand and fill the entire screen on mobile devices when embedded? Basically, the exact same functionality and behaviour as when the content is opened in a new window.

I'm crossing my fingers and hoping that this can be done.

Thanks in advance!

Dave

 

 

6 Replies
Ashley Terwilliger-Pollard

Hey Dave and Hannah, 

If the content is embedded within the page, we'll keep the play set up within that page vs. opening it into a full screen view. If you wanted it to appear embedded but still open full screen you could set it to open in a new window but that behavior would occur regardless of the devices users were accessing it on (desktop, mobile, etc.). 

I'll defer to the community in case they have any other ideas for how to force the content to go full screen on the mobile devices only - as there may be some custom code that you could look at using.