Forum Discussion
Conditionally hide scene
Hi all,
I am working on a multilingual course and have set the menu to visible. I have it structured so that language 1 is in scene 1 to 10, and language 2 is in scene 11 to 20.
When the learner starts the course, all slides for all scenes appear. Is it possible to conditionally hide the other scene(s)? I'm concerned that having them all visible will create some confusion.
Thanks in advance.
- WilliamRyan-dbaCommunity Member
...in the past, I used custom navigation buttons for other courses, including courses with only one language, because 1) the extra work involved in creating the triggers, adjusting states etc. delayed development time and 2), the navigation buttons took up valuable slide real estate...
- MathNotermans-9Community Member
Basically this is what you need.
const listElements = document.querySelectorAll('li div.cs-listitem.listitem');
for(var i = 0 ; i < listElements.length; i++){
listElements[i].id = 'list_'+i;
console.log("list "+i);
if(i > 4){
listElements[i].style.visibility="hidden";
}
}
Depending on the exact setup of your project you need to figure out which of the listitems, as the menu in Storyline is just a <li> you want to hide.
Here you can see a working sample.
https://360.articulate.com/review/content/716c1463-079c-4b71-90db-fb59ede46e4f/review
And attached my sample.As in my sample you can switch languages/li-items, there is an extra line to show all li's.
Kind regards,
Math - WilliamRyan-dbaCommunity Member
Thanks for the reply. Unfortunately my skills at JavaScript are next to nil and I don't really understand the code... I'm the VBA kind of guy.
- MathNotermans-9Community Member
If you know VBA, javascript is a piece of cake :-)
And Javascript is the only solution for this in Storyline.