1

私は2つの画像を持っていますが、そのうちの1つは非常に小さく、もう1つに重ねられています。大きい画像にカーソルを合わせると、その上に2番目の画像が表示されます。これはうまくいきます。残念ながら、小さい画像(大きい画像の上にあることを覚えておいてください)の上にマウスを移動すると、画面が激しく点滅します。システムは、実際にはそうではないのに、大きな画像を残していると見なします。コードを投稿させてください。

<li id="li-{{ photo.id }}">
    <div class="photo-container">
        <img class="photo" src="{{ photo.thumbnailFile.url }}"/>
        <img class="delete-button" src="{{ STATIC_URL }}delete_photo.jpg "/>
    </div>
</li>

function DisplayPhotoOptions() {
$("#personal-photo-list .photo").hover(function(event) {
    $(this).fadeTo("fast", 0.5);
    $(this).next(".delete-button").css("visibility", "visible");
}, function() {
    $(this).fadeTo("fast", 1.0);
    $(this).next(".delete-button").css("visibility", "hidden");
});

(function() {
    $(document).ready(function() {
         DisplayPhotoOptions()
    });
    })();

誰かがこの問題を解決する方法を知っていますか?

4

1 に答える 1

6

.delete-photoは子ではないため、カーソルは大きな画像を残しています。

にバインドhoverしてみてください.photo-container

于 2012-09-30T15:33:27.017 に答える