Permite la creación de menús contextuales en cualquier aplicación WEB, muy parecidos a los que se usan en las aplicaciones de escritorio.
El código esta diseñado para no requerir ninguna dependencia de otra librería, por lo que puede ser integrado en cualquier proyecto sin afectar su comportamiento
Su uso es muy sencillo, basta con incluir el archivo JS en donde se quiere usar, también es posible importarlo vía CDN.
Esta librería es completamente gratuita, puedes usarla en tus proyectos personales o comerciales sin ningún costo.
Para ver una demostración de como se visualiza el menú contextual puedes hacer clic en el botón izquierdo del mouse (botón de opciones) sobre la imagen.
Descarga el archivo javascript con el código de la librería y agregalo a tu proyecto mediante la etiqueta script
<script src="./assets/js/lib-menu-contextual.js"></script>
A continuación se muestra un ejemplo de un menú de opciones, el menú debe ser una lista UL con las clases
jctx jctx-id-TU-IDentificador jctx-black jctx-black-shadow cada elemento debe tener el atributo
data-action el cual es la accion a ejecutar cuando el usuario haga clic.
<!-- MENU CONTEXTUAL DEL DEMO --> <ul class="jctx jctx-id-foo jctx-black jctx-black-shadow"> <li data-action="opcion1">Opcion 1</li> <li data-action="opcion2">Opcion 2</li> <li data-action="opcion3">Opcion 3</li> <hr> <li data-action="copiar">Copiar Imagen</li> <li data-action="borrar">Borrar Imagen</li> <li data-action="etc">Etc</li> <li data-action="" class="disabled">Cerrar</li> </ul>
Agrega este script con la funcion handleMenuAction la cual sera llamada cada vez que se hace clic en alguna opcion del menu, puedes usar un switch para controlar la logica de cada opcion.
<script> function handleMenuAction(evt) { alert("Se ejecuto la opcion: " + evt); } </script>