自定义右菜单

来源:互联网 发布:闲鱼怎么换淘宝账号 编辑:程序博客网 时间:2024/05/16 12:41

html:

<div id="menu">
    <li>重新加载</li>
    <li>返回</li>
    <li>另存为</li>
    <li>打印</li>
</div>

js:

//    自定义右键菜单;
//    获取menu元素;
    var menu = document.getElementById("menu");
//    首先取消右键菜单的默认事件
    window.oncontextmenu = function(e){
        var e = e || window.event;
        menu.style.display = "block";
        menu.style.left = e.clientX + "px";
        menu.style.top = e.clientY + "px";
        return false;
    }
    menu.onclick = function(e){
        e.stopPropagation();
    }
    window.onclick = function(){
        menu.style.display = "none";
    }


原创粉丝点击