Stop playback on popup/modal close...

Jul 11, 2012


I am loading Storyline projects into a iframe which is contained in a modal popup built with jQuery. A user clicks a button and the pop-up appears with the Storyline project viewable and ready for playback. If the user starts playback and then closes the popup prior to the Storyline finishing playback it is no longer viewable but you can still hear the narration from Storyline. How would one go about ending playback of the Storyline project when a user clicks the "x" for the popup? I need a solution for both html and flash versions of the published project.

Any help would be hugely appreciated!

12 Replies
Richard Bakos

Thank you Andrew but I do have the Storyline properly published and embedded into the iframe... Let me show you the issue I am having... If you go here:

Then click on case 1 at the top, you will notice a pop-up when the case loads with Storyline in it... If you click the "start" button in Storyline playback will begin... Now if you click the "x" on the pop-up you will see that the pop-up holding Storyline goes away but you can still hear it playing... I need playback to stop when someone clicks that "x"... 

Surely someone out there has seen this before and has a solution??? We just acquired Storyline and this is our first project using it so all insight is helpful... I am one of the developers and haven't even touched Storyline... Our design department uses it and then us developers integrate it (or attempt to) into sites and LMS... So if there is anything they can do on their end during the process of creating or publishing the Storyline projects to get this (or something similar) to work, that would be useful as well.


Richard Bakos

Hello Gerry,

Very strange, it does not stop for me in Firefox or any other browser I've tried, and I've tried a lot... Perhaps you just got to the end of the video (it's short) when you clicked on the "x"? 

The pop-up was created with html, css and jquery... It was not done with Storyline at all... Our design team hands the storyline to us when they are done and we add them... Client wants the Storyline media in a pop-up so I created one to place the media in... If there is a method of creating this pop-up functionality with a close feature in Storyline itself I'm all all ears (and eyes) and will pass the info over to the design department so they can do that from now on... Hopefully there is some way to achieve this...

Thanks for the help so far!

Richard Bakos

Thanks Gerry, but that is not the problem I am having... The video does not keep playing after the slide has ended... It keeps playing (to the end and then stops) even if the modal pop-up window is closed. When the pop-up is closed, we would like the storyline media to behave as if it has been closed... The reason it keeps playing is because the pop-up's css property of display is set to "none" when the "x" button is clicked... So it's still there, it's just hidden... Make sense? So far I don't see a good solution to make playback pause or stop when the pop-up is closed(hidden) especially when it comes to the flash fallback... There isn't a clear solution to get javascript to hook into the storyline media... Which brings me to another thing I noticed... I use google chrome for the most part except when I am doing cross browser testing and even though we publish out to html5 and flash, when I view story.html in chrome it goes to the flash version... Why? Chrome supports html5 so why doesn't it display the html5 version automatically instead of going to the flash version? If I direct chrome directly to the story_html5.html it plays fine... So why am I being directed to flash when visiting story.html? Doesn't make sense... It seems to be incorrectly detecting my browser or something...

Richard Bakos

BTW... We came up with a solution... Since the storyline media we have is just movies really, without any interactivity we are going to convert the output to html5 video formats and display that way since javascript can hook into that easily enough using tags with identifiers... And then have a fallback flv file loaded into a flv player that has a javascript "API"... 

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