CSS圖像精靈 - 更改顯示設置圖像不顯示

Question

我試圖更改圖像使用CSS精靈，現在，問題是顯示：無;顯示：block;從jQuery的工作，但圖像沒有顯示（我檢查通過螢火其變化的HTML，但圖像沒有顯示在所有）

$('#logobrandingactive').css({'display': 'block'}); 
$('#logobranding').css({'display': 'none'}); 
$('#logobrandingactive').css('opacity','1'); 

#logobranding { 
    opacity: 0.5; 
    display: none; 
    background-image: url("../images/servicesbranding.png"); 
    background-repeat: no-repeat; 
    position: absolute; 
    z-index: 15; 
    top:175px; 
    left: 50%; 
    margin-left: -81px; 
    width: 162px; 
    height: 162px; 
} 
#logobrandingactive { 
    opacity: 0.5; 
    display: none; 
    background-image: url("../images/moservicesbranding.png"); 
    background-repeat: no-repeat; 
    position: absolute; 
    z-index: 16; 
    top:175px; 
    left: 50%; 
    margin-left: -81px; 
    width: 162px; 
    height: 162px; 
} 

Answer 1

試試這個。

.loader { 
    width:100px; 
    height:100px; 
    position:absolute; 
    top:50%; 
    left:50%; 
    margin:-50px 0 0 -50px; 
    background:url(../path/to/image.jpg) no-repeat 0 0; 
    display:none; 
} 

隱藏和可見的jQuery

$(document).ready(function(){ 

$(".loader").show()// For visible; for hide use .hide() 

$(".loader").css({'background-image':'url(../path/to/image.jpg)'}); //Changing background image. 

});