zoukankan      html  css  js  c++  java
  • 借用鼠标指定的对象实现动态显示和隐藏菜单

    <!DOCTYPE html>
    <html xmlns="http://www.w3.org/1999/xhtml">
    <head>
    <meta http-equiv="Content-Type" content="text/html; charset=utf-8"/>
        <title></title>
        <style type="text/css">
            #p > li {
                list-style-type:none;
                float:left;
                80px;
                cursor:pointer;
            }
            .hide {
                display: none;
            }
            .show {
                position: absolute;
                list-style-type: none;
                display: block;
                margin: 0;
                padding: 0;
                background-color: Gray;
            }
        </style>
        <script>
            //document.getElementsByTagName
            function show(li)
            {
                var ul = l1.getElementsByTagName("ul");
                for (var i = 0; i < ul.length; i++)
                {
                    //alert("执行到这了");
                   // alert(ul.innerText);
                    if (ul[i].className == "hide")
                    {
                        ul[i].className = "show"
                    }
                }
            }

        </script>
    </head>
    <body>
        <ul id="p">
            <li id="l1" onmousemove="show(this)">
                文件
                <ul class="hide" id="memu">
                    <li>新建</li>
                    <li>保存</li>
                    <li>另存为</li>
                    <li>退出</li>
                </ul>
            </li>

            <li>
                编辑
                <ul class="hide" id="memu">
                    <li>新建</li>
                    <li>保存</li>
                    <li>另存为</li>
                    <li>退出</li>
                </ul>
            </li>
            <li>
                插入
                <ul class="hide" id="memu">
                    <li>新建</li>
                    <li>保存</li> 
                    <li>另存为</li>
                    <li>退出</li>
                </ul>
            </li>
            <li>
                窗体
                <ul class="hide" id="memu">
                    <li>新建</li>
                    <li>保存</li>
                    <li>另存为</li>
                    <li>退出</li>
                </ul>
            </li>
            <li>
                帮助
                <ul class="hide" id="memu">
                    <li>新建</li>
                    <li>保存</li>
                    <li>另存为</li>
                    <li>退出</li>
                </ul>
            </li>
        </ul>

    </body>
    </html>

  • 相关阅读:
    【CF446D】DZY Loves Games 高斯消元+矩阵乘法
    【CF542D】Superhero's Job 暴力
    【CF660E】Different Subsets For All Tuples 结论题
    【CF666C】Codeword 结论题+暴力
    【CF666E】Forensic Examination 广义后缀自动机+倍增+线段树合并
    【CF461E】Appleman and a Game 倍增floyd
    【CF471E】MUH and Lots and Lots of Segments 扫描线+并查集+线段树+set
    【CF480D】Parcels DP
    【CF497E】Subsequences Return 矩阵乘法
    SSAS 项目部署失败的问题
  • 原文地址:https://www.cnblogs.com/shangguanjinwen/p/3709900.html
Copyright © 2011-2022 走看看