0

メニューに行間に非表示のメニューを表示させようとしています。純粋な CSS メニューは必要ありません。これはより少ないマークアップで実行できることを認識してください。また、ロットが不足しています。これはただ切り貼りして作り直しただけです。

html は次のとおりです。

   <nav>
<div class="navigation_toplevel">
    <a href="Index"><h4>Home</h4></a>
</div>

<div class="navigation_toplevel has_sub">
    <a href="Index"><h4>Home</h4></a>
</div>
<div class="navigation_bottomlevel">
    <ul>
        <li>Preferences</li>
        <li>Preferences</li>
        <li>Preferences</li>
    </ul>
</div>
<div class="navigation_toplevel has_sub">
    <a href="Index"><h4>Home</h4></a>
</div>
<div class="navigation_bottomlevel">
    <ul>
        <li>Preferences</li>
        <li>Preferences</li>
        <li>Preferences</li>
    </ul>
</div>
<div class="navigation_toplevel has_sub">
    <a href="Index"><h4>Home</h4></a>
</div>
<div class="navigation_bottomlevel">
    <ul>
        <li>Preferences</li>
        <li>Preferences</li>
        <li>Preferences</li>
    </ul>
</div>
<div class="navigation_toplevel has_sub">
    <a href="Index"><h4>Home</h4></a>
</div>
<div class="navigation_bottomlevel">
    <ul>
        <li>Preferences</li>
        <li>Preferences</li>
        <li>Preferences</li>
    </ul>
</div>
<div class="navigation_toplevel has_sub">
    <a href="Index"><h4>Home</h4></a>
</div>
<div class="navigation_bottomlevel">
    <ul>
        <li>Preferences</li>
        <li>Preferences</li>
        <li>Preferences</li>
    </ul>
</div>
</nav>

このメニューは完全に流動的である必要があり (windows が小さい場合、行ごとに 1、2、または 3 リンクである可能性があります)、サブメニューを下に水平に表示し、nav コンテナーを埋める必要があるため、このように設定しました。

私のJquery：

<script>
$(document).ready(function () {


    if ($(".navigation_toplevel").hasClass("has_sub")) {
        $(this).hover(function () {
            $(".navigation_toplevel").nextAll("div:first").toggleClass("show_sub");
        });
            }

            else { }
      });

</script>

ここで何が間違っていますか？

4

1 に答える 1

0

コレクションを$(".navigation_toplevel")返します。クラス名で要素を取得するときにコレクションを操作する正しい方法は、$(".navigation_toplevel").each(function(){ do something with a single element }). しかし、あなたの場合、次のようなコードが必要だと思います：$(".navigation_toplevel.has_sub").hover(mouseInHandler, mouseOutHandler)

于 2013-09-23T19:39:47.487 に答える