1

タイトルがそれを十分に説明しているかどうかはわかりませんが、かなり短くしようとしていました!

そのため、ページの周りに散らばっている多数の画像があり、それらすべてのライトボックス ギャラリーを作成しました (.cboxElement はそれを呼び出すクラスです)。これに追加したかったのは、ライトボックスの影響を受ける各画像のホバー効果で、ユーザーはズームできることがわかりました。

問題:

私はサイトの元のコードを書いていません。これは新しい機能です。画像間でクラスに一貫性がないため、次のように、各画像の前に、ホバー メソッドが参照する一意のクラスを持つタグを追加する必要がありました。

    $("a.cboxElement").each(function(){
        $(this).prepend("<span class='zoom'></span>");
    });

この直後に、ホバー効果を使用しました。

    $("a.cboxElement").hover(function(){
        $("a.cboxElement span").fadeIn('fast');
    },
    function(){
        $("a.cboxElement span").fadeOut('fast');
    });

問題は、ページ上の画像にカーソルを合わせると、ホバー効果がすべての画像に同時に表示され、ホバーしている画像だけに影響を与える方法がわからないことです。

私に何ができるかについて誰かアイデアがありますか?

どうもありがとう、

ジョン

4

4 に答える 4

3

ホバー割り当てのスコープを変更するだけでよいと思います:

$("a.cboxElement").hover(function(){
    $(this).find("span").fadeIn('fast');
},
function(){
    $(this).find("span").fadeOut('fast');
});

元のコードは次のように言っていa.cboxElementました。上記のコードは、ホバー時にfor each を示し、これだけを見つけてフェードイン/フェードアウトします。a.cboxElementspana.cboxElementspan a.cboxElement

于 2011-08-26T13:41:31.637 に答える
1

.fadeToggleまた、単一の関数で使用できます。

$("a.cboxElement").hover(function(){
    $(this).find("span").fadeToggle("fast");
});
于 2011-08-26T13:44:38.850 に答える
0

各画像に属性を割り当て、クラスid="..."全体ではなくそれを選択します。a.cboxElement

<img id="imageid1" ... >
$('#imageid1')....
于 2011-08-26T13:40:40.007 に答える
0
$("a.cboxElement").hover(function(){
    $(this).find('span:first').fadeIn('fast');
},
function(){
    $(this).find('span:first').fadeOut('fast');
});
于 2011-08-26T13:41:41.620 に答える