Heim > Artikel > Backend-Entwicklung > php后管理分类导航菜单，php分类导航菜单_PHP教程

php后管理分类导航菜单，php分类导航菜单_PHP教程

WBOYOriginal: 2016-07-13 16:53:54869Durchsuche

php后管理分类导航菜单，php分类导航菜单

<!DOCTYPE>
<html>
<head>
    <meta http-equiv="Content-type" content="text/html" charset="utf-8">
    <title>后台管理折叠导航菜单</title>
    <style><span>
        body{
            margin</span>:0<span>;
            padding</span>:0<span>;
            text</span>-align:<span>center;
            font</span>:normal 12px Arial,Verdana,<span>Tahoma;
            line</span>-height:150%<span>;
        }
        a</span>:link, a:<span>visited{
            color</span>:<span>#</span><span>385065;</span>
            text-decoration:<span>none;
        }
        a</span>:<span>hover{
            text</span>-decoration:<span>underline;
        }
        </span><span>#</span><span>menu{</span>
            width:<span>150px;
            margin</span>:0<span> 15px;
            padding</span>:0<span>;
            text</span>-align:<span>left;
            </span><span>list</span>-style:<span>none;
        }
        </span><span>#</span><span>menu .item{</span>
            background:<span>#</span><span>ccaaee;</span>
            padding:<span>0px;
            </span><span>list</span>-style:<span>none;
            border</span>:1px solid <span>#</span><span>eee;</span>
<span>        }
        a</span>.title:link, a.title:visited, a.title:<span>hover{
            display</span>:<span>block;
            color</span>:<span>#</span><span>385065;</span>
            font-weight:<span>bold;
            padding</span>:2px 0 0<span> 22px;
            width</span>:<span>128px;
            line</span>-height:<span>23px;
            cursor</span>:<span>pointer;
            text</span>-decoration:<span>none;
        }
        </span><span>#</span><span>menu .item ul{</span>
            border:1px solid <span>#</span><span>9facb7;</span>
            margin:0<span>;
            width</span>:<span>116px;
            padding</span>:<span>3px 0px 3px 30px;
            bakground</span>:<span>#</span><span>fff;</span>
            <span>list</span>-style:<span>none;
            display</span>:<span>none;
        }
        </span><span>#</span><span>menu .item ul li{</span>
            display:<span>block;
        }
    </span></style>
    <script type="text/javascript">
        <span>function</span><span> hideAllObj(){
            </span><span>var</span> items = document.getElementsByClassName("option"<span>);
            </span><span>for</span>(<span>var</span> j=0; j<items.length; j++<span>){
                items[j]</span>.style.display = "none"<span>;
            }
        }

        </span><span>function</span><span> check(){
            document</span>.getElementById("opt_1").style.display = "block"<span>;
            </span><span>var</span> items = document.getElementsByClassName("title"<span>);
            </span><span>for</span>(<span>var</span> j=0; j<items.length; j++<span>){
                items[j]</span>.onclick = <span>function</span><span>(){
                    </span><span>var</span> obj = document.getElementById("opt_" + this.<span>name);
                    </span><span>if</span>(obj.style.display != "block"<span>){
                        hideAllObj();
                        obj</span>.style.display = "block"<span>;
                    }</span><span>else</span><span>{
                        obj</span>.style.display = "none"<span>;
                    }
                }
            }
        }

        document</span>.getElementsByClassName=<span>function</span><span>(classname){
            </span><span>var</span> retnode =<span> [];
            </span><span>var</span> myclass = <span>new</span> RegExp('\\b'+classname+'\\b'<span>);
            </span><span>var</span> elem = this.getElementsByTagName('*'<span>);
            </span><span>for</span>(<span>var</span> j=0; j<elem.length; j++<span>){
                </span><span>var</span> classes = elem[j].<span>className;
                </span><span>if</span>(myclass.<span>test(classes)){
                    retnode</span>.<span>push(elem[j]);
                }
            }
            </span><span>return</span><span> retnode;
        }
    </span></script>
</head>
<body onload="check()">
<ul id="menu">
    <li <span>class</span>="item"><a href="javascript:void(0)" <span>class</span>="title" name="1">用户管理</a>
    <ul id="opt_1" <span>class</span>="option">
        <li><a href="#">添加用户</a></li>
        <li><a href="#">管理用户</a></li>
    </ul>
    </li>
   <li <span>class</span>="item"><a href="javascript:void(0)" <span>class</span>="title" name="2">用户管理</a>
    <ul id="opt_2" <span>class</span>="option">
        <li><a href="#">添加用户</a></li>
        <li><a href="#">管理用户</a></li>
    </ul>
    </li>
   <li <span>class</span>="item"><a href="javascript:void(0)" <span>class</span>="title" name="3">用户管理</a>
    <ul id="opt_3" <span>class</span>="option">
        <li><a href="#">添加用户</a></li>
        <li><a href="#">管理用户</a></li>
    </ul>
    </li>
   <li <span>class</span>="item"><a href="javascript:void(0)" <span>class</span>="title" name="4">用户管理</a>
    <ul id="opt_4" <span>class</span>="option">
        <li><a href="#">添加用户</a></li>
        <li><a href="#">管理用户</a></li>
    </ul>
    </li>


</ul>

</body>
</html>

Stellungnahme：

Der Inhalt dieses Artikels wird freiwillig von Internetnutzern beigesteuert und das Urheberrecht liegt beim ursprünglichen Autor. Diese Website übernimmt keine entsprechende rechtliche Verantwortung. Wenn Sie Inhalte finden, bei denen der Verdacht eines Plagiats oder einer Rechtsverletzung besteht, wenden Sie sich bitte an admin@php.cn

Vorheriger Artikel：添加数据之后不跳页面显示一个漂亮的提示信息（非ajax提交数据），提示信息ajax_PHP教程Nächster Artikel：DooDigestAuth php（后台）授权管理类 web浏览器授权，php网站后台webshell_PHP教程

In Verbindung stehende Artikel

Mehr sehen