0

クロムでの読み込み画像に問題があります。サファリとFirefoxでは問題なく見えますが、クロムでは、1つの全体ではなく2つの半分の読み込み画像が表示されます。この問題を解決する方法がわかりません。助けていただければ幸いです。

HTML:

<div class="execute-actions">
    <div class="loading"></div>
</div>

CSS:

 .loading {
    position: relative;
    background: url("../../assets/img/core/loading.gif");
    background-position: 912px 0px;
    width: 48px;
    height: 48px;
}

ローディングアニメーションを参照するTHE JSの一部：

    $(window).ready(function () {
    if ($("html[data-useragent*='MSIE 8']").length) {
        if ($("div.loading")) {
            setInterval(function () {
                $("div.loading").css({"background-position-x": "-=48px" });
            }, 35);
        }
    } else {
        if ($("div.loading")) {
            setInterval(function () {
                $("div.loading").css({"background-position": "-=48px" });
            }, 35);
        }
    }
4

1 に答える 1

0

アニメーションの実行中に .loading div の CSS スタイルを確認します。x 軸と y 軸の両方が上書きされていることがわかるでしょう。フィドルなしではこれ以上は言えませんが、おそらく chrome は background-position-y を 50% に設定します。したがって、おそらくクロムでも「background-position-x」を使用する必要があります:)

于 2013-10-10T15:16:04.063 に答える