0

次のHTMLをさまざまなDIVに追加しました。ホバーしたDIVだけに表示したいオーバーレイです。ただし、オーバーレイがすべてのDIVに表示されるため、以下のコードのHTMLブロックを含む要素にカーソルを合わせると。ただし、オーバーレイをDIV iホバーに表示するだけで、すべてを表示することはできません。.parent（）を見つけようとしましたが、機能していません。私は何が間違っているのですか？

<div id="appBillboard">
    <!-- edit window overlay -->
    <div class="editOverlay">
        <div class="editBTN">
            <div class="editIcon bL5"></div>
            <div class="editTxt bR5 bRLight">EDIT</div>
        </div>
    </div>
</div>

JS：

//HOVER HIDE & SHOW EDIT OVERLAY AND BUTTON

var editBTN = $('.editBTN');
var overlay = $('.editOverlay');

$(editBTN).fadeTo(0, 0.90);

$(overlay).hover(function () {

    //find parent div
    var location = $(this).parent();

    $(overlay, location).fadeTo(0, 1);
    $(editBTN, location).fadeTo(0, 1);
    $(overlay, location).addClass('overlayBKGND');

}, function () {
    $(overlay).removeClass('overlayBKGND');
    $(editBTN).fadeTo(0, 0.90);

});
4

3 に答える 3

1

現在の階層のみにスコープされたセレクターを使用する必要があります。そのため、キャッシュされたjQueryオブジェクトにはすべてのオブジェクトが含まれているため、使用できません。

さらに、.hover（）に渡される2つの関数はそれぞれ別個の関数であり、ローカル変数を共有しないため、それぞれの位置変数を再計算する必要があります。

また、アニメーションの期間中にを使用fadeTo()している理由もわかりません。アニメーションコード全体を調べるよりも0、単に使用する方がおそらく良いでしょう。.css("opacity", value)

コードを次のように変更します。

$(overlay).hover(function () {
    //find parent div
    var location = $(this).parent().parent();
    $('.editOverlay', location).fadeTo(0, 1).addClass('overlayBKGND');
    $('.editBTN', location).fadeTo(0, 1);

}, function () {
    var location = $(this).parent().parent();
    $('.editOverlay', location).removeClass('overlayBKGND');
    $('.editBTN', location).fadeTo(0, 0.90);

});
于 2012-08-19T23:05:24.450 に答える
0

このコード行は、'overlay'divの親と一致します。

var location = $(this).parent().parent();

貼り付けたhtmlコードに基づいて、親divを取得したかったと思います。

var location = $(this).parent();
于 2012-08-19T23:07:31.103 に答える
0

parent()メソッドを使用$(selector, context)して現在のホバー要素を選択する代わりに、を使用しないのはなぜthisですか？次のことを試してください。

$('.editBTN').fadeTo(0, 0.90);

$('.editOverlay').hover(function () {
    $(this).fadeTo(0, 1).addClass('overlayBKGND');
    $('.editBTN', this).fadeTo(0, 1);
}, function () {
    $(this).removeClass('overlayBKGND');
    $('.editBTN', this).fadeTo(0, 0.90);
});
于 2012-08-19T23:08:42.280 に答える