11

Firefoxに問題があります。私のウェブサイトにはたくさんの画像があります。Firefoxでページを閲覧すると、画像の読み込み中に境界線と画像のタイトルが表示されます。ダウンロードが完了すると、この境界線/タイトルは消え、画像に置き換えられます。

これはFirefoxでのみ発生します。Chromeやその他のブラウザは、境界線やタイトルのない画像をロードします。これは、はるかに「きれい」に見えます。言い換えれば、Firefoxによって生成されたこれらの境界線は醜いです。

それを削除して、ローダーなどに置き換えることはできますか？私はbackground-image：url（）でcssローダーを追加しようとしました...これらの境界線は表示されないと思っていましたが、まだそこにあります。

pinterest、dribbbleなどのサイトは、Firefoxで境界線を作成せずに、どのように画像を配信しますか？

ありがとうございました

画像の読み込み中のFirefoxの境界線

4

2 に答える 2

22

：-moz-loading psuedo-classを使用して、表示されないように設定できます。このようなものが機能するはずです：

img:-moz-loading {
    visibility: hidden;
}

これに代わるものは、AJAX読み込みスクリプトのようなもので、画像を背景に読み込み、読み込みダイアログまたはアニメーションを表示します。これを行うには多くのテクニックがあり、ここまたはGoogleで検索すると、これを効果的に行う方法について多くの多くの結果が表示されます。

于 2012-11-23T02:58:22.610 に答える
0

CSSを使用してロードを明示的に待つ必要はありません。これはjavascriptでも実行できます。

    var img = document.getElementById("some-image");
    img.style.display = "none";
    //...
    //add to dom etc...
    //..
    img.onload = function () {
        img.loaded = true;
        img.style.display = "inherit";
    }
于 2013-07-20T22:18:34.033 に答える