Forum Discussion
How to temporary hide a customized player button
Hello E-learning Heroes!
I am working on the project, where as part of it I created a Player button, which lightboxes a particular slide. But, the thing is that I don't need it to be visible always.
I am wondering if there is a way to temporary disable it or hide.
Would you be so kind to help me understand if this is possible.
Thank you!
- NedimCommunity Member
Normally, when you add a custom player tab, the Storyline assign an unique ID name that this tab could be identified with. In this Storyline version, the custom player tabs are identified as "link-right-0", "link-right-1", "link-right-2" etc. depending of how many custom tabs are being created in the player settings. Find out what ID has been assigned to your custom tab and run this JavaScript code in the "Execute JavaScript When the timeline starts on this slide" trigger:
To hide it on any slide:const customTab = document.getElementById('link-right-1');
customTab.style.display = 'none';
To show it again on the next slide or any other slide:const customTab = document.getElementById('link-right-1');
customTab.style.display = 'block';
Just keep in mind that JavaScript will not run in Preview. It has to be published to Review 360, Web or LMS to test it out.
- ElviraBurdynskaCommunity Member
Hello Nedim.
It was so helpful, you cannot even imagine. Thanks a lot!!!
By the way, while I was testing I figured out, that my button's ID is "link-right-5". Then, I changed it's order (I put it in front of all other buttons), which actually impacted the ID. It became "link-right-0".
This means that ID is assigned by Storyline to every custom player button depending on it's order in the Player.
- JudyNolletSuper Hero
Depending on the position of the button and the background, the simplest option would be to cover it when needed with a shape that's the same color as the background.
Another option: If the button is on the Master slide, you could add triggers on the Master that change the button to Normal or to Hidden with conditions based on the value of a T/F variable. (For example, change the state of the button to Normal when the timeline starts if the variable = True.)
Obviously, you'll also need to create that T/F variable. To control it, use triggers on the slides to adjust its value as needed.
- If the user can only go through the course in a linear fashion (that is, that can't jump around), you need fewer triggers. For example, slide 1 might have a trigger to change the variable to True, which would show the button. Subsequent slides would show the button, until you get to a slide with a trigger that changes the variable to False.
- If the user might jump around in the course, you'll need a trigger on every slide to adjust the variable as needed.
FYI: Here's more info about trigger conditions and variables:
- ElviraBurdynskaCommunity Member
Hello Judy,
first of all, thanks for your reply.
The button I am talking about is a Player button. So, it's not on the master slide or on any other slide.
I have added it on the top of the player, just next to the Resources tab.
So far I was able to find only how to hide/unhide Next or Previous player buttons. But, if I want to add a trigger to Change State of "my player button" to hidden, I don't have it in the list in the Triggers window.
- JudyNolletSuper Hero
Thanks for the clarification.
The Slide Properties let you choose which of the built-in Player Features will show on a given slide. For example, you can hide the Menu or the Resources on quiz slides.
Unfortunately, there isn't a setting for temporarily hiding a custom tab that you add to the Player. (At least, there isn't in Storyline itself. It could be done with JavaScript, but I can't help with that.)
- ElviraBurdynskaCommunity Member
Thank you for help, Judy. I will try to implement it with Java.
- NedimCommunity Member
You are welcome, Elvira! Thanks for additional information :)