스타일 시트에서 일치하는 이미지로 jquery .css 이미지를 동적으로 변경하십시오.

Question

다음 스타일 시트에서 일치하는 jquery 코드의 CSS 이미지를 동적으로 변경하려고합니다.

jQuery(document).ready(function($) { 
$(".trigger-wrapper").click(function() { 
    $("#menu-wrapper-left").stop().animate({width: 'toggle'}); 
    $('#hero-container').css('image1.jpg)'); 
    return false; 
}); 
}); 

아래의 내용에 유의하십시오.

$('#hero-container').css('image1.jpg)'); 

어떻게 이것을 스타일 시트의 번호 매겨진 이미지와 일치하도록 동적으로 변경할 수 있습니까?

스타일 시트의 이미지는 이와 같이 저장됩니다.

.hero li:nth-child(1) span { 
    background-image: url('http://image1.jpg'); 
} 
.hero li:nth-child(2) span { 
    background-image: url('http://image2.jpg'); 
} 
.hero li:nth-child(3) span { 
    background-image: url('http://image3.jpg'); 
} 

여기에 html이 있습니다.

<div id="hero-container" class="swipe slide"> 
    <ul class="hero transparent"> 
    <li><span>Image 01</span></li> 
    <li><span>Image 02</span></li> 
    <li><span>Image 03</span></li> 
    </ul> 
<div> 

감사

Answer 1

사용 ({ '배경 이미지': 'img.png를'})?

편집 :

시도 : 당신은 어떤 수리를해야 할 수도 있습니다

 
var a = 1; // set n child 
var bgUrl $(".hero li:nth-child("+a+") span").css("background-image"); // get bg img 
$("#hero-container").css({"background-image":bgUrl}); // set bg img 

.

http://api.jquery.com/nth-child-selector/ http://api.jquery.com/css/