1

スライドナビゲーションを作ろうとしています。これが私のコードです

html

<li>
    <a href="#">Services</a>
   <div class="subcategories">
    <a href="#">Cleaning</a>
  </div>
</li>

サブカテゴリ div は非表示です。

js

$('li a').hover(function() {
  $(this).next().slideToggle('fast', function() {

   });
});

このコードは機能します。問題は、マウスが外に出ると、サブカテゴリの div が消えることです。

私が欲しいのは、ユーザーがサブカテゴリのdivを表示するようにliをポイントすると、ユーザーがサブナビゲーションのリンクをクリックできるようになることです。

4

3 に答える 3

0

これを試してくださいデモ http://jsfiddle.net/QEkDa/ または http://jsfiddle.net/qmrHm/

何か見逃した場合はお知らせください！

残りが原因に合うことを願っています:)

コード

$(".subcategories").hide();
$('li a').mouseover(function() {
       $(this).next().slideToggle('fast', function() { // <== could use slideDown

    }).mouseout(function() {
        $(".subcategories").slideUp();

    });
});​​
于 2012-10-13T09:11:42.287 に答える
0 
$('li').hover(function(){
    $(this).children('.subcategories').slideToggle('fast', function(){});
});

これを試してみてください。ホバー アクションを li に配置する必要があります。または、マウスを div の上に置くと非表示になります。これは、div ではなく div にいるためです。

そのchildren()liの下のクラス「サブカテゴリ」であるノードのアクションを選択すると、まだliにいるため、非表示になりません

于 2012-10-13T09:19:42.617 に答える
0

a:first を使用します

 $('li a:first').hover(function() {
  $(this).next().slideToggle('fast', function() {
  });
});
于 2012-10-13T09:21:32.110 に答える