2011-06-13 5 views
2

이미지를로드하고 배경으로 설정하는 다음 스크립트 (from here)가 있습니다. 그것은 잘 작동하지만 슬라이드 쇼가 될 수 있도록 하나 이상의 사진을 추가하려면 무엇을 변경해야합니까?jQuery/css로 배경 이미지를 페이딩 하시겠습니까?

jQuery를이 :

$(document).ready(function(){ 

    $.fn.smartBackgroundImage = function(url){ 
     var t = this; 
     //create an img so the browser will download the image: 
     $('<img />') 
     .attr('src', url) 
     .load(function(){ //attach onload to set background-image 
       t.each(function(){ 
       $(this).css('backgroundImage', 'url('+url+')'); 
       }); 
      }); 
     return this; 
    } 
    $('body').smartBackgroundImage('/static/images/temp-bg.jpg'); 

}); 

감사합니다!

+3

위법하거나 그럴 생각은 없지만 생각해보십시오. JS에서 코드 작성하는 방법을 알고 있으므로 문제는 아닙니다. 논리적으로 문제가 발생했을 때의 상황을 생각하고 구체적인 상황을 생각한 다음 실제 코드를 고려하십시오. 도중에 문제가 발생하면 질문을하십시오. 폭이 좁고 연구 된 질문보다 더 많은 질문에 눈살을 찌푸리게됩니다. 행운을 빕니다! :) –

+0

불쾌감을 느끼지 못했습니다. 단지 프로젝트에서 늦게 달리고있었습니다. 해결책은 간단 해 보입니다. 아마도 이미지를 통해 사라지는 루프에 넣을 것입니다. – Cris

+1

거기에 있었으므로. :) 레코드의 경우,'setInterval (time)'이 여기에 편리합니다. 사진을 변경하려면 간격을 설정하기 만하면됩니다. https://developer.mozilla.org/En/Window.setInterval –

답변

0

이미지를 <li> 태그로 HTML에 통합하고 jquery로 형식을 지정하십시오. 나중에 쉽게 변경할 수 있습니다.

관련 문제