Chuck Sigmund asked for some help in the Adobe Captivate Users LinkedIn Group. He needs to create a multi-level menu.
My solution uses a bit of JavaScript/Jquery trickery and I only built it for the Responsive output.
I add a “>” to the beginning of the slide name of any slide I want to indent (ex: >Level 2 slide”).
Then I run this JS when the course loads:
$( ".tocText nobr:contains('>')" ).each(function( index ) {
var str = $( this ).text()
var res = str.replace(/>/g, " ");
$( this ).html(res)
$(this).parent().siblings(".tocBookmark").css("left", 20)
});
That code will will check all the TOC entries (.tocText) to see if they contain a “>”.
Then it replaces the “>” with two spaces ( “ ”).
And finally it finds the items bullet point and moves it to the left as well.
It’s not perfect… but it’s a great starting point.
Leave a comment if you tweak this or if you have any questions.
Contact me if you have an eLearning Puzzle you need to solve.