php后管理分类导航菜单,php分类导航菜单
Jun 13, 2016 am 08:54 AMphp后管理分类导航菜单,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>

Article chaud

Outils chauds Tags

Article chaud

Tags d'article chaud

Bloc-notes++7.3.1
Éditeur de code facile à utiliser et gratuit

SublimeText3 version chinoise
Version chinoise, très simple à utiliser

Envoyer Studio 13.0.1
Puissant environnement de développement intégré PHP

Dreamweaver CS6
Outils de développement Web visuel

SublimeText3 version Mac
Logiciel d'édition de code au niveau de Dieu (SublimeText3)

Sujets chauds

Comment implémenter le menu de navigation basé sur les autorisations dans Laravel

Comment utiliser JavaScript pour obtenir l'effet de surbrillance en faisant défiler le menu de navigation jusqu'à une position spécifiée ?

Comment utiliser le menu de navigation dans ThinkPHP6

HTML, CSS et jQuery : créez un beau menu de navigation

Comment implémenter un menu de navigation à défilement fluide sur une page Web via du CSS pur

HTML, CSS et jQuery : créez un effet d'animation déroulant dans le menu de navigation

Étapes de mise en œuvre pour la mise en œuvre d'un menu de navigation réactif en utilisant du CSS pur

HTML, CSS et jQuery : créez un menu de navigation de premier niveau avec des effets d'animation
