How to implement external Javascript menu?

Report · Dec 01, 2011

Hi gang-

I'm trying to include a drop-down menu in each topic in a RoboHelp 8 help project. This menu uses Javascript and the jQuery library to implement the drop-downs, which requires two external .js files. In addition, there is a function call that activates the menu, and the HTML file for the menu itself. I'm having difficulty getting this to work.

The site from which I pulled the menu is located at : http://www.egrappler.com/multi-level-hierarchical-jquery-menu-jqsimplemenu/

So far, I've put the js references and function call in the head section of a master page:

$(document).ready(function () {

$('.menu').jqsimplemenu();

});

//]]></script>

I've added the JS files as baggage in the project.

I've put the HTML into a snippet, and then placed that in the master page as well. The menu appears, but the JavaScript isn't working to create the drop-downs. I've also placed the js and function calls into the snippet, with the same result. I've also tried various path options, such as adding a leading slash to the src path (/js/jqsimplemenu.js), and referencing the root of the project (../jqsimplemenu.js).

The only time I can get the menu to work is when I place the JS and function calls directly into each topic, which isn't really ideal or efficient in our team environment.

Any thoughts? Thanks.

-=Ed.

Report · Dec 02, 2011

Hi,

So far, I've put the js references and function call in the head section of a master page:

Did you add the script in the <head> section or in the header of the master page? I suggest that you create a header in the master page and add the code there. That will let RoboHelp create relative paths to the file from the different topics when you generate.

Greet,

Willam

Report · Dec 02, 2011

Clever, very clever, Willam. That seems to work quite well. I appreciate your simple and effective answer!

How to implement external Javascript menu?

1 Correct answer