0

このjqueryを使用して、ホバーしたときに別のdivの上にdivを表示していますが、何らかの理由で、fadeINとfadeOUTが機能しているように見えても機能しません。

私がfadeToをfadeInとにfadeOutそれぞれ変更した場合、前にカーソルを合わせたものが消えないので、それはそれを壊しますか？

$(function() {
$(".report-hover").hover(
    function() {
        $(this).children("img").fadeTo(200, 0.85).end().children(".report-image-hover").show();
    },
    function() {
        $(this).children("img").fadeTo(200, 1).end().children(".report-image-hover").hide();
    });
});

マークアップ：

<div class="report-hover">

                <div class="report-image-hover">
                <a href="#">
                <img src="<?php bloginfo('template_url'); ?>/images/.....png" alt="Report" />
                </a>
                </div>

                <img src="<?php bloginfo('template_url'); ?>/images/.....png" alt="Report" />
</div>
4

2 に答える 2

0

これをチェックしてください：JSfiddle

FadeToをFadeInに置き換えるだけの場合は、FadeInのパラメーターが異なるため、機能しません。JQuery FadeIn

于 2012-10-08T09:57:19.780 に答える
0

フェードアウトする画像を選択するときでは.find()なく、を使用する必要があります。直接の子孫のみが選択され、画像は引き続き。内にネストされます。ドキュメントを参照してください：.children().children()div

.children（）メソッドは.find（）とは異なり、.children（）はDOMツリーを1レベル下に移動するだけですが、.find（）は複数のレベルを下に移動して、子孫要素（孫など）も選択できます。

次のようなコードの場合：

$(".report-hover").hover(
    function() {
        $(this).find("img").fadeTo(200, 0.85).end().children(".report-image-hover").show();
    },
    function() {
        $(this).find("img").fadeTo(200, 1).end().children(".report-image-hover").hide();
});
于 2012-10-08T10:05:30.333 に答える