Forum Discussion
Show / Hide Audio Control for Selected Slides
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
Hi there, John! You can choose certain Player features at the slide level in the Slide Properties window. The volume control will be enabled for all slides, however, if you have it checked in your Player settings.
- JohnBlumCommunity Member
Hi Crystal,
The first thing I did was check the Slide Properties window.
I was hoping there was a setting somewhere that I missed.
Thank you,
John
- SamWilliamson-eCommunity Member
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.
- MarkAnthonyChesCommunity Member
Hello Sam!
Great idea! How could I use the same approach but referencing a custom menu button in the player?
Any ideas?
Thanks in advance!!!
- ElisabettaTe561Community Member
Thank you Sam, this was really helpful!
- RajShindeCommunity Member
You just need to changes your custom menu button ID in the code
document.getElementById('link-right-0').style.display = 'none';
- JieLinLeeCommunity Member
hello! i used this script in my e-learning module, the button appears for a mili second before it disappears. did that happen on your e-learning module? if yes, how is it resolved? TIA!
- ThereseMicha925Community Member
I need to do the same and hide the volume button on some slides, but I don't know the default button name in Storyline 360 to use it for the JS. Can you help please?
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!
- ThereseMicha925Community Member
Thank you, Jose, this script works very well.
Many thanks!