How to Hide Objects/Text When Video Starts

Jan 19, 2022

The first slide of my first lesson contains a Welcome video, and it's the first slide anyone is seeing of an eight-part course. I have one text box "Press Play to begin" with a circle around the Play button so they know where to go, but I can't seem to get them to hide once the video has started. I have triggers set to change the state of the circle and the text box to hidden when the user clicks the video, but they are still showing. Any thoughts or suggestions?

9 Replies
Maria Costa-Stienstra

Hi, Amitty.

Thank you for reaching out!

Without seeing the .story file, my initial thought is that the triggers you are using are "when the user clicks the Video", but clicking the play button is not the same as clicking the video.

My suggestion is to add a hotspot to the play button. You can then connect all the triggers to that hotspot (changing the state of the textbox and the circle to hidden, and playing the video):

Windows 10 (1) 2022-01-19 at 10.08.25 AM

Preview:

Screen Recording 2022-01-19 at 10.05.53 AM

I hope this helps!

Tim Waldron

I've got the same problem but I have some accessibility features implemented, so the user has various ways to start and stop a video (mouse and keyboard inputs). So in my case, a mouse-only approach sadly won't work. 

There seems to be a "when media ends" trigger, but I can't find a corresponding "when media starts" trigger (or a "when media hits X timecode"). I'm a bit puzzled... would love some help. :)

Andrea Koehntop

Hi Tim, great question! 

I found a similar thread about how to add a trigger when media begins. Take a look and see if that helps you! 

You could also set up a trigger to Play Media when Timeline Reaches a certain amount of time specified by you. 

Please let me know if you have any additional questions regarding this, I'm happy to help! 

Tim Waldron
Andrea Koehntop

Hi Tim, great question! 

I found a similar thread about how to add a trigger when media begins. Take a look and see if that helps you! 

You could also set up a trigger to Play Media when Timeline Reaches a certain amount of time specified by you. 

Please let me know if you have any additional questions regarding this, I'm happy to help! 

Thanks for your help and suggestions. :)

As far as I can see it's the same solution on the other thread, where a trigger object is placed over the play button. 

In my case that sadly doesn't really help, as I use an (optional) key input to start the videos. I could probably create some sort of messy workaround with  duplicate functions, for both mouse object and key inputs. But I'd prefer to keep my code more or less clean. 

I might try a JS-Script... do you know if the "when media starts" trigger can be called with JavaScript? Or is there possibly even a JS-encyclopedia or command documentation for Storyline anywhere? That would be extremely useful. 

Tim Waldron
Walt Hamilton

One option would be to have the media play at a certain time in the slide timeline. Then you can pause the timeline just before that point. Any method you have of starting the media can now be changed to resume the timeline, and the media will play.

Oh, that's an interesting idea! Will have a closer look at that. Might be a good alternative if the JavaScript solution doesn't work. :)

Walt Hamilton

You asked:

Or is there possibly even a JS-encyclopedia or command documentation for Storyline anywhere?

Storyline doesn't run JS, so there is little need for documentation. It stores the script and passes it to the browser. It is the browser that executes the script.

That said, there are some places where JS and SL interact, mainly passing variables back and forth. Also, the GSAP library can control some elements on the page, giving the appearance of SL doing it. So your main ability to use JS for this would be to pass SL a new value for a variable, and trigger your actions on when the variable changes.

W3schools has a pretty comprehensive reference of  JS commands.

Personally, I use JS only as a very last resort, because when it comes time to do maintenance, there may not be an ID with programming experience available.