Forum Discussion
Javascript question - Hide the "Next Module" button in Litmos.
We use Litmos as our LMS. We want users to be able to use the convenient "Next Module" button in the upper right corner. But this can also be used to "skip" to the next module, which we don't want. So we'd like JS to hide the element at the beginning of a course, then enable it again on the last slide.
When I inspect the clickable element in the upper menu bar, this is the info:
<a class="m-nav-item pull-right hidden-xs" href="#" onclick="scormPlayer.next();" id="module_Next">
<div class="m-nav-btn">
<i class="fa fa-fast-forward" aria-hidden="true"></i> Next module
</div>
</a>
Can I get an assist on the code to HIDE this element, and re=enable it later?
Things I tried unsuccessfully:
let div = document.querySelector("#module_Next");
div.style.display = 'none';
const tab1 = document.querySelector("#fa fa-fast-backward");
tab1.style.display = "none";
var nextmodule = document.getElementById('Next module');
nextmodule.style.display = "none";Hi Jerry,
How I would do it is the last thing you tried "unsuccessfully".
The only problem was you passed it the wrong <id>The ID is here:
<a class="m-nav-item pull-right hidden-xs" href="#" onclick="scormPlayer.next();" id="module_Next">
and shows as "module_Next", so I think this line should get you the reference you need:
let nextmodule = document.getElementById("module_Next");Hello Jerry,
The course might be running inside of an iframe, so you may need to target the parent or even the top window.
Try:
let nextmodule = window.parent.document.getElementById("module_Next");
nextmodule.style.display = "none";Or:
let nextmodule = window.top.document.getElementById("module_Next");
nextmodule.style.display = "none";do i understand correctly - you want to access the lms environment with storyline javascript and change it
Russel, you nailed it. IT was a the window.parent that did the trick.
Andrew, thanks for the syntax correction on the ID name, as well!
