Using an iframe in Storyline

Nov 29, 2021

Hi there,

I wondered if anyone could help. I have embedded an iframe for a video into my course and want the learner to watch the video in full before they continue. I can do this fine when it's an MP4 but using the iframe won't allow me to manage the behaviour. 

I am attaching a file with 2 screens: first one with file inserted directly in Articulate and the other with iframe.

1)    As you can see, version with file inserted works just fine: after video is watched and cards are revealed, Next button goes red and it’s possible to move forward. I’ve left the navigation opened for now (just for our review purposes), but once completed - the navigation will be closed and completing all conditions will be only way to move forward.

2)    Unfortunately, when the video comes from iframe code, I cannot find the way that course can communicate with that iframe – or actually get the information that video has been completed.

I’ve done some research and looks like only way to achieve that is to use Javascript script in Storyline (which I am not that fluent with). Would anyone be able to provide such a script?

MTIA!

 

2 Replies
David Tait

If you want to avoid JS, a pretty crude way of handling this would be to make your slide timeline the same (or slightly longer) duartion to the video. That way, when the video ends, the timeline should end at a similar time too, at which point you could fire some triggers in Storyline to do whatever you like.

There are obvious flaws to this, such as if the user waits for any amount of time to start the video, or they pause the video then the video and the slide timeline will be completely out of sync, but if you can live with that it might be worth considering.