Forum Discussion

PhoebeGoldberg-'s avatar
PhoebeGoldberg-
Community Member
8 months ago

How can I show/hide a video while keeping it synced to the timeline?

I'm working on incorporating ASL video in my slides for the first time and am stumped on how I can show/hide the video while keeping it synced to the timeline. I've built a javascript button as a player tab which toggles a variable to 0 or 1. With that variable I can show/hide a layer with my video (waving hand) or use states to show/hide a gif (SpongeBob) as seen in my example: https://360.articulate.com/review/content/dbb8a6c8-5e34-45ff-bd4c-283f2dd86c1b/review

My problem is when I show the objects, the video/gif starts at the beginning. I need the ability to have the video/gif tied to the timeline so the ASL is in sync with the presentation. Any creative solutions?

storyline 360
  • elizabeth's avatar
    elizabeth
    Partner
    8 months ago

    What if you used a shape to hide the ASL video, and a variable to create the toggle button to change the state of the shape to hidden or normal? That way the video is actually always there, on the base layer, and the ASL video is playing the entire time. Just an idea! I attached an example.

  • SteveGannon's avatar
    SteveGannon
    Community Member
    8 months ago

    I agree with Elizabeth that having the ASL video on the base layer might be the easier way to go.

    In the sample attached, I instead used motion paths to bring the video onto the slide and make it disappear. The minimum motion path duration is 0.10 seconds so you do see it move on/off the slide but it's very quick.

    I set the timeline in the sample to 30 seconds to coincide with the video's duration of 30 seconds. You can use the pause/play buttons as well as drag the seekbar forward/backward to see how they stay in sync.

    • PhoebeGoldberg-'s avatar
      PhoebeGoldberg-
      Community Member
      8 months ago
      Steve Gannon

      I agree with Elizabeth that having the ASL video on the base layer might be the easier way to go.

      In the sample attached, I instead used motion paths to bring the video onto the slide and make it disappear. The minimum motion path duration is 0.10 seconds so you do see it move on/off the slide but it's very quick.

      I set the timeline in the sample to 30 seconds to coincide with the video's duration of 30 seconds. You can use the pause/play buttons as well as drag the seekbar forward/backward to see how they stay in sync.

      That is such a brilliant solution and elegant for the user. Thanks so much for helping me think through this and for providing me with a sample!

      For anyone who comes across this, I integrated the show/hide button as a player tab with the following javascript, so it should apply to every slide in the training:

      var player=GetPlayer();
      if (player.GetVar("ASL") == 0){
      player.SetVar("ASL", 1);
      } else {
      player.SetVar("ASL", 0);
      }

Related Content