0

3 レベルの UL を使いやすいナビゲーション システムに変えようとしています。

私の考えでは、最初の UL を作成し、LI を表示しますが、UL UL と UL UL UL をそれぞれの LI と共に非表示にします。

誰かが LI の上部をクリックして、その LI 内に UL を表示できるようにしたいと思います。

その場合、親 UL は LI とともに非表示になりますが、選択したサブ UL は非表示になります。

次に別の LI をクリックすると、LI の子 UL とそれぞれの LI が表示されます。

その効果は、一度に 1 つの UL だけが表示されることです。

私はこれが複雑であることを理解しており、これがどのように行われるかを理解することはできません.CSSとjQueryの組み合わせを推測しています.

私が話していることとそれを実装する方法について誰かがアイデアを持っていれば、それは素晴らしいことです。

編集

固定幅の div 内に UL を配置するので、overflow:hidden および未使用の UL に負の値を使用して、「擬似隠蔽」を行うことができます。

4

1 に答える 1

0

これは、私がJSFiddleで行った小さなモックアップです。これを実現するには、いくつかの非正統的な回避策を講じる必要があります。

はい、それを実現するには jQuery が必要です。例としてホバーで作成しました。必要なイベントを使用できます。これは単なるプリンシパルです。

$('.subdropdown').hover(
    function() { $(this).parent().parent().css({'visibility': 'hidden'});
    $(this).css({'visibility': 'visible'});},
    function() { $(this).parent().parent().css({'visibility': 'visible'});}
);​

お役に立てれば。

于 2012-10-31T10:54:12.950 に答える