Chrome瀏覽器顯示與Safari和Firefox不同的加載圖片效果

我在瀏覽器中加載圖片時遇到問題，它在safari和firefox中看起來很好，但是在Chrome中，我獲得了兩個加載圖片而不是整個圖片的視圖。我不知道如何解決這個問題，任何幫助表示讚賞。Chrome瀏覽器顯示與Safari和Firefox不同的加載圖片效果

的HTML：

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

的CSS：THE JS的

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

部分引用加載動畫：

$(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); 
     } 
    }

來源

2013-10-10 meztli

你可以發佈小提琴嗎？ – Reinherd

背景位置的預期行爲是什麼：「 - = 48px」？在第一個ifyou中動畫一個軸，第二個動畫是x軸，而y軸應該是「center」而不是「0」 – fcalderan

檢查的.loading DIV CSS樣式而動畫正在運行。您可能會看到x軸和y軸都被覆蓋。沒有小提琴就不能多說，但可能會將背景位置-y設置爲50％。所以可能你也應該在chrome中使用'background-position-x':)

來源

2013-10-10 15:16:04

Chrome瀏覽器顯示與Safari和Firefox不同的加載圖片效果

回答

相關問題