<!DOCTYPE html>

<html>

<head>

    <title>ContextMenu Event Example</title>

    <script type="text/javascript" src="EventUtil.js"></script>

</head>

<body>

    <div id="myDiv">Right click or Ctrl+click me to get a custom context menu. Click anywhere else to get the default context menu.</div>

    <ul id="myMenu" style="position:absolute;visibility:hidden;background-color:silver">

        <li><a href="http://www.nczonline.net">Nicholas' site</a></li>

        <li><a href="http://www.wrox.com">Wrox site</a></li>

        <li><a href="http://www.yahoo.com">Yahoo!</a></li>

    </ul>

    <script type="text/javascript">

        EventUtil.addHandler(window, "load", function(event){

            EventUtil.addHandler(document, "contextmenu", function(event){

                event = EventUtil.getEvent(event);

                EventUtil.preventDefault(event);

                var menu = document.getElementById("myMenu");

                menu.style.left = event.clientX + "px";

                menu.style.top = event.clientY + "px";

                menu.style.visibility = "visible";

            });

            EventUtil.addHandler(document, "click", function(event){

                document.getElementById("myMenu").style.visibility = "hidden";

            });

        });

    </script>

</body>

</html>

contextMenu,右键菜单的更多相关文章

  1. 3种不同的ContextMenu右键菜单演示

    简单使用的右键菜单,希望能帮助大家.下面是截图和实例代码 实例预览 <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional/ ...

  2. vue2.0的contextmenu右键菜单

    1.事情对象 <!DOCTYPE html> <html> <head> <title></title> <meta charset= ...

  3. WPF中ContextMenu(右键菜单)使用Command在部分控件上默认为灰色的处理方法

    原文:WPF中ContextMenu(右键菜单)使用Command在部分控件上默认为灰色的处理方法 问题描述 今天发现如果我想在一个TextBlock弄一个右键菜单,并且使用Command绑定,结果发 ...

  4. [xPlugins] jQuery Contextmenu右键菜单

    [2012-04-12] Contextmenu 右键菜单 v0.1 版本发布 [功能] 在特定区域弹出右键菜单 [功能] 可以在弹出右键菜单区域内,再屏蔽某个小区域. [功能] 有两种方式添加右键菜 ...

  5. JQuery之ContextMenu(右键菜单)

    插件下载地址:http://www.trendskitchens.co.nz/jquery/contextmenu/jquery.contextmenu.r2.js压缩版:http://www.tre ...

  6. Bootstrap 树形列表与右键菜单

    Bootstrap 树形列表与右键菜单 介绍两个Bootstrap的扩展 Bootstrap Tree View 树形列表 jQuery contextMenu 右键菜单 Demo采用CDN分发,直接 ...

  7. JS组件系列——Bootstrap右键菜单解决方案：ContextMenu

    前言:有段时间没发表随笔了,过个年人都变得懒了.新年刚来上班,今天正好得空,将去年遗留的两个小组件总结记录下.有朋友跟我说:你的bootstrap组件要能够形成一个可以满足一般项目需求的系列组件,才有 ...

  8. jQuery右键菜单contextMenu使用实例

    在最近项目中需要频繁的右键菜单操作.我采用了contextMenu这款jQuery插件. 参考网址:http://www.jb51.net/article/58709.htm 官网demo http: ...

  9. Jquery 右键菜单(ContextMenu)插件使用记录

    目前做的项目需要在页面里面用右键菜单,在网上找到两种jquery的右键菜单插件,但是都有各种问题.所以就自己动手把两种插件结合了下. 修改后的右键菜单插架可以根据绑定的触发页面元素不同,复用同一个菜单 ...

随机推荐

  1. STL笔记之set

    //---------------------------------------------------------// set综述//------------------------------- ...

  2. TCP/IP模型各个层次的功能和协议

      层次名称 功    能 协    议 应用层 (Application Layer) 负责实现一切与应用程序相关的功能,对应OSI参考模型的上三层 FTP(文件传输协议) HTTP(超文本传输协议 ...

  3. css单独设定样式

    <style type="text/css"> #footer { position: fixed; bottom: 0; } .td-right{ border-ri ...

  4. C++读取excel特定行列中的数据

    可以通过COM API调用才是正解,不过需要编写COM接口类,Excel对象库的接口太多了……不过可以用工具自动生成. 我最近也在用VC操作Excel,在VC中可以这样做,在任何一个cpp文件中加入下 ...

  5. android AsyncTask介绍 转载

    http://www.cnblogs.com/devinzhang/archive/2012/02/13/2350070.html AsyncTask和Handler对比 1 ) AsyncTask实 ...

  6. java dom4j解析xml实例(3)

    代码运行前需要先导入dom4j架包. 需要解析的XML文件test.xml如下: <students> <student age="25"><!--如 ...

  7. DataSet和List<T> 泛型之间互相转换 (转载, 作者写的很好)

    /DataSet与泛型集合间的互相转换 //利用反射机制将DataTable的字段与自定义类型的公开属性互相赋值. //注意:从DataSet到IList<T>的转换,自定义类型的公开属性 ...

  8. margin问题

    <!DOCTYPE html> <html> <head> <meta charset="utf-8"> <title> ...

  9. hrbust 1721 A + B = 0 map的应用

    13级春季校赛的热身题,但优化后我的代码也超时了,后来看了看学长的解法,觉得最简单的还是map,再一次感受到了map的强大. 题目描述如下 Description There is an intege ...

  10. PAT (Advanced Level) 1074. Reversing Linked List (25)

    简单题. #include<cstdio> #include<cstring> #include<cmath> #include<vector> #in ...