0

クロスフェード効果のある単純なフォト ギャラリーを作成すると、奇妙な動作が発生します。

(1.) 元の画像の上にオーバーレイ画像をフェードインし、(2.) 下にある元の画像の src 属性をオーバーレイ画像の属性に変更し、最後にステップ、(3.)オーバーレイ画像を削除します。

$("#photo").attr({
    src: imageURL,
    alt: altText
});
$("#overlay-photo").remove();

上記のコード (最後の 2 つのステップを示しています) は、すべての画像がキャッシュされている場合に機能します。おそらく、属性の変更と src 属性の削除が同時に発生し、削除は src 属性を変更するよりも少し速い可能性があるため、キャッシュが空の場合、更新された画像を表示する前に、変更されていない古い画像を簡単にフラッシュします。画像を更新しています。

$("#photo").attr({
    src: imageURL,
    alt: altText
}).each(function () {
    $("#overlay-photo").remove();
});

ご覧のとおり、コールバック関数 (この場合はそれぞれ) を何らかの方法でアタッチしようとしましたが、問題は解決しませんでした。

4

1 に答える 1

0

これをチェックしてください。私はそれがあなたのために働くと思います:

   $('#overlay-photo').fadeIn(500,function() {

        $('#photo').hide().one('load',function() {
            $(this).fadeIn();
            $('#overlay-photo').remove();
        }).attr({
            src: imageURL,
            alt: altText
        });
    });
于 2011-05-08T09:53:34.900 に答える