zoukankan      html  css  js  c++  java

  • 转一个右键菜单，支持不同对象不同菜单，兼容IE、Firefox

    <html>
    <head>
    <title>ddd</title>
    <style>
    .DreamMenu     {
        position    :absolute;
        visibility    :hidden;
        z-index    :100;
        overflow    :hidden;
        width    :150px;
        background-color    :buttonface;
        border    :dimgray 1px solid !important;
        border    :buttonhighlight menu menu buttonhighlight 2px outset;
        padding    :1px !important;
        padding    :1px 1px 1px 0px;
        font-size    :12px;
    }
    .DreamMenu ul     {
        margin    :1px;
        border-bottom    :buttonhighlight 1px solid;
        border-top    :buttonshadow 1px solid;
    }
    .DreamMenu a     {
        display    :block;
        width    :100%;
        padding    :1px 2px 2px 20px;
        cursor    :default;
        text-decoration    :none;
        color    :#000000;
    }
    .DreamMenu a:hover     {
        background    :highlight; 
        color    :#ffffff;
    }
    </style>
    </head>
    <body menu='menu'>
    <!---这段js最好写进文件方便用，为了在51能运行就直接写进来了--->
    <script>
    /***
    DreamCore - JsLib/Menu
    Date     : Dec 03, 2006
    Copyright: DreamSoft Co.,Ltd.
    Mail     : Dream@Dreamsoft.Ca
    Author   : Egmax
    Browser : IE5.0&+,Firefox1.5&+,Netscape7.0&+
    Update:
    **    */
    if(!document.all) document.captureEvents(Event.MOUSEDOWN);
    var _Tmenu = 0;
    var _Amenu = 0;
    var _Type = 'A';
    document.onclick     = _Hidden;
    function _Hidden()
    {
            if(_Tmenu==0) return;
        document.getElementById(_Tmenu).style.visibility    ='hidden';
        _Tmenu    =0;
    }
    document.oncontextmenu     = function (e)
    {
        _Hidden();
            var _Obj = document.all ? event.srcElement : e.target;
            if(_Type.indexOf(_Obj.tagName) == -1) return;
        _Amenu     = _Obj.getAttribute('menu');
            if(_Amenu == 'null') return;
            if(document.all) e = event;
        _ShowMenu(_Amenu, e);
            return false;
    }
    function _ShowMenu(Eid, event)
    {
            var _Menu = document.getElementById(Eid);
            var _Left = event.clientX + document.body.scrollLeft;
            var _Top = event.clientY + document.body.scrollTop;
        _Menu.style.left     = _Left.toString() + 'px';
        _Menu.style.top     = _Top.toString() + 'px';
        _Menu.style.visibility     = 'visible';
        _Tmenu     = Eid;
    }
    /***
    可以支持其他标签INPUT,IMG
    **    */
    </script>
    <script>_Type='INPUT,A,DIV,BODY,IMG';</script>
    <!-----设置一个菜单层---->
    <div id="menu" class='DreamMenu'>
    <a href='0'>您好</a>
    <a href='1'>我是主菜单</a>
    <a href='2'>在页面上单击</a>
    <a href='3'>就可以看到我</a>
    <ul></ul>
    <a href='4'>打印</a>
    </div>
    <!-----设置一个菜单层---->
    <div id="menu2" class='DreamMenu'>
    <a href='0'>哈哈</a>
    <a href='1'>我是个链接</a>
    <a href='2'>好开心啊</a>
    <a href='3'>查看</a>
    <ul></ul>
    <a href='4'>打印</a>
    </div>
    <!-----设置一个菜单层---->
    <div id="menu3" class='DreamMenu'>
    <a href='0'>哈哈</a>
    <a href='1'>我是图片</a>
    <a href='2'>虽然打不开</a>
    <a href='3'>查看</a>
    <ul></ul>
    <a href='4'>打印</a>
    </div>
    <table><tr><td height=100>
    <!-----设置一个菜单menu属性---->
    <a href='test.php' menu='menu2'>菜单1</a>
    <a href='test.php' menu='menu2'>菜单2</a>
    </td></tr></table>
    <div style='height:300;' menu='menu'></div>
    <img src='http://bbs.51js.com/images/default/logo.gif' menu='menu3'>
  • 相关阅读:
    web页面常用方法及INI文件的读取方法
    winform 三个Panel左右切换(panel里面填充图片)
    图片渐出轮播的效果
    Winform跑马灯——Graphics运用
    .net 3.5 新功能重写ToInt()方法
    style.display
    SQL: 分页SQL SQL2005函数分页!
    JS: 验证输入必须为数字
    Table 里面点标题会进行排序
    在Div中绑定数据
  • 原文地址：https://www.cnblogs.com/heimark/p/1656723.html
Copyright © 2011-2022 走看看