0

ツリービューメニューを作成するために、ほとんどcssを実行しました。しかし、問題は、ツリーがマウスオーバーでのみ機能することです。リンクをクリックしてツリーを開いたり閉じたりしたい。

私のHTMLは次のとおりです。

<div id="global-nav">
        <ul>
            <li><a href="#">One</a></li>
            <li><a href="#">Two</a></li>
            <li><a href="#">Three</a></li>
            <li><a href='#' class="sidemenu-sub-menu-header">Four</a>
            <ul>
                <li><a href="#">1.2 One</a></li>
                <li><a href="#">1.2 two</a></li>
            </ul></li>
        </ul>
</div>

私のCss：

.sidemenu-sub-menu-header { font-weight: bold; color: black;}


#global-nav {font-size: 17px; }
#global-nav ul li{padding: 2px 10px 2px 10px;}
#global-nav ul ul li{ display: none;}
#global-nav li:hover ul li { display: block; }

メニューを開いたり、トグルバーのようにメニューを閉じたりするための小さなスクリプトが必要です。ありがとう

4

4 に答える 4

2

それはあなたのために働きます：

$('#global-nav li a').click(function(){

   var nextUl = $(this).next('ul');

   if(nextUl[0] != undefined){
     nextUl.toggle(); //Alternate the visibility
   };

});
于 2012-09-28T17:49:03.870 に答える
2

このjqueryプラグインを使用して、必要なことを簡単に実現できますhttp://bassistance.de/jquery-plugins/jquery-plugin-treeview/

デモ http://jquery.bassistance.de/treeview/demo/prerendered.html

于 2012-10-11T14:23:44.430 に答える
0

CSSクリックに応答できません。Jqueryトグル関数を使用することをお勧めします。

于 2012-09-28T17:48:06.903 に答える
0

javascriptの便利で（一見）広く使用されているonclick関数を調べてください...！

于 2012-09-28T17:48:42.253 に答える