제이쿼리에서
이미지값을 가지고 있는 요소의 속성값을 읽어온 뒤 이를 배경이미지로 넣어서 보여주기 위한 코드를 작성하였습니다. 하지만 실행해보니 정상 동작을 하지 않는 경우 확인할 부분이 어디에 있는지 알아보겠습니다.
# css('background-image') 예제소스 코드아래코드는 li 태그에 있는 속성값 data-imgname의 값을 불러온 뒤 이를 해당 태그 안에 있는 thumbImg 클래스명안에 백그라운드 형태로 넣어 출력하는 방법입니다.
* HTML 코드<body>
<li data-imgname="test.jpg">
<div class="thumbImg"></div>
</li>
</body>
* 스크립트 코드// 이미지 배경으로 삽입하기
thumbEles = $('li[data-imgname]');
for (i=0; i < thumbEles.length ; i++) {
thumbName = 'url(./images/' + thumbEles.eq(i).attr('data-imgname') + ')';
thumbEles.eq(i).find('div.thumbImg').css('background-image', thumbName);
}