anasik/contextmenus.js

Purely Javascript based solution allowing for easy creation of right-click context menus.

contextmenus.js

Purely Javascript based solution allowing for easy creation of right-click context menus.

Installation:

Add the following html to the head tag of the document (to be honest, it doesnt matter where you add them, but the head is where most of us would prefer them to be.)

<link rel="stylesheet" href="contextmenus.css"/>

<script src="contextmenus.js"></script>

Defining menus

So let's suppose that we have an element with the id: "lithium," and we want it to have a context menu, that shows up every time a user right-clicks on it. All you have to do is define the menu as a "ul" tag, within the class: "contextmenu", and with the id: "lithiummenu." A stripped down version of your code should look something like this.

<div id="lithium">Above Sodium and before Magnesium.</div>

<ul class="contextmenu" id="lithiummenu">

<li>Lithium Nitrate</li>

<li>Lithium Sulfate</li>

<li>Lithium Carbonate</li>

</ul>

And guess what? That's it!