0

JQuery/Javascript の初心者です。メニューを作成しました。ユーザーがメニューの項目にカーソルを合わせると、背景色が変わります。（CSSで簡単にできます。）ユーザーが実際にアイテムを選択したときに、アイテム名の上に矢印が表示されるようにしたい（背景画像のホバー効果のように）しかし、ホバー効果とは異なり、矢印が残ってほしいユーザーがメニューの別の項目を選択するまで。基本的に、私は Zappos がここで行ったことを再現しようとしています (靴の左側にあるミニ フローティング メニューを参照してください): http://www.zappos.com/dr-scholls-jamie-black-dot?zfcTest=fcl% 3A0 .

選択したメニュー項目の強調表示に関する多くの Stackoverflow の質問と回答を見ましたが、探しているものはまったくありませんでした。これはまさに Zappos のフローティング メニューが行うことです。

どんな助けでも大歓迎です！

アナアンジ

4

2 に答える 2

1

ここで jsfiddle で行ったことを確認してください。

ザッポスで同様の効果を出すには

$(document).ready(function() {

    $('ul li').hover(
        function() {
        if ( !$('div').hasClass('blue') ) {
            $(this).addClass('gray');
        }
        },
       function() {
           $(this).removeClass('gray');
       }
    );

    $('ul li').click( function() {
        $('ul li').removeClass('blue');
        $(this).addClass('blue');
    });
});

編集: css クラスに矢印の付いた背景を追加することで、必要な矢印効果を追加できます。ホバー時に矢印を表示するか (灰色のクラス)、クリック時に矢印を表示するか (青色のクラス) に応じて

于 2013-09-22T03:35:57.233 に答える