Show / Hide Audio Control for Selected Slides

Aug 17, 2018

Hi Everyone,

I am developing a series of courses with no narration, and have the audio control hidden on the player.  Some courses will have videos inserted in the slides.

For only those slides with videos, is there a way to show the audio control, while leaving it hidden on the remaining slides?

Thank you,

John

10 Replies
Sam Williamson

Hey John,

I believe the only way to hide the volume control per slide is using JavaScript, but it should be fairly simple. It's a bit annoying to test as you won't be able to check the results when Previewing in Storyline itself – you'll have to publish to see any 'Script in action – but this particular function shouldn't require too much iteration.

Note: I believe this method will only work for HTML5 output, not Flash. Also, I can't vouch for it working in the new Modern player as I don't have Storyline 360.

Essentially you're creating a custom Trigger Action to show/hide the volume control. So, add a Trigger to one of your video slides:

Action: Execute JavaScript

When: Timeline starts

Object: [Your slide]

Now click the ellipsis button next to Script and simply paste in the following:

$('.btn.cs-button.volume').show()

When your video slide starts it should now show the volume control! However, the control will stay visible until we turn it off again. I'd say the most thorough way to do this – not knowing how your course is structured or restricted – is to place a similar trigger on all of your non-video slides which ensure the volume slider isn't visible, using the following JavaScript:

$('.btn.cs-button.volume').hide()

As I said this code won't execute during Preview, but as long as you place the appropriate Trigger on every slide there should be little to no fiddling involved.

Hope that helps.

 

Jose Tansengco

Hi T M, 

Some community members have found success using the Javascript code below to hide the volume button in the Player: 

document.getElementById('volume').style.display = 'none';

I'll let other community members chime in to confirm if this is the correct object. We don't officially support Javascript, but I hope this points you in the right direction!