Forum Discussion

JerryBeaucaire's avatar
JerryBeaucaire
Community Member
2 months ago

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>&nbsp;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";
storyline 360
  • AndrewHanley's avatar
    AndrewHanley
    Community Member
    2 months ago

    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");
  • RussellKillips-'s avatar
    RussellKillips-
    Community Member
    2 months ago

    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";

  • Jürgen_Schoene_'s avatar
    Jürgen_Schoene_
    Community Member
    2 months ago

    do i understand correctly - you want to access the lms environment with storyline javascript and change it

Related Content