jquery를 사용하여 background-size를 100 %로 설정하는 방법은 무엇입니까?

Question

nivo-lazy 슬라이더를 사용할 때 이미지가 슬라이더 - 래퍼에 맞지 않는 문제가 발생합니다. NIVO 슬라이더에 나는

.nivoSlider img { 
position:absolute; 
top:0px; 
left:0px; 
max-width: none; 

    width:100%; 
    height:100% !important; 
} 

는하지만 NIVO - 게으른 슬라이더 작동하지 않는 해결책을 발견했다.

nivo-lazy 슬라이더는 jquery를 사용하여 배경 이미지를 변경한다고 생각합니다. background-size를 넣을 때 : 100 % 100 %; 브라우저의 inspect 요소에서 요소 스타일로; 그것은 작동합니다. 그래서 Jquery를 통해 백그라운드 크기를 100 %로 설정해야합니다.

어떻게하면됩니까 ?? 도움에 미리 감사드립니다.

업데이트

나는 다음과 같은 형식으로 작성합니다. 라인에서 JQuery와 - NIVO-slider.js에서

slider.css('background','url("something.jpeg") no-repeat','background-size','100% 100%'); 

그리고 123

나는

slider.css('background','url("'+ parse_src(vars.currentImage) +'") no-repeat'); 
document.getElementById('slider').style.backgroundSize = "100% 100%"; 

에 코드를 변경합니다하지만 지금은 문제는 이미지의 동적 크기를 사용하고 있다는 점이다 그 슬라이더는 각각의 이미지 너비에 따라 작은 작은 div와 그 너비를 설정할 것입니다.

Answer 1

jQuery를 사용하여 CSS 속성을 변경할 수 있습니다. 당신이 사용하는 요소가 id="nivo-lazy-div이있는 경우

, 다음을 수행하십시오

$("#nivo-lazy-div").css("background-size":"100% 100%"); 

업데이트

만 배경 이미지를 변경하는 경우는, 당신은 실제로이를 설정할 필요가 없습니다 때마다. CSS에 추가하면 배경 이미지의 크기가 다시 조정됩니다.

#nivo-lazy-div{ 
    background-size:100% 100%; 
} 

업데이트

는이 작업을 수행 :

slider.css({ 
    'background' : 'url("' + parse_src(vars.currentImage) + '") no-repeat', 
    'background-size' : '100% 100%', 
}); 

Answer 2

당신은 당신의 배경을 문서에로드 된 직후에 100 %를 설정 jQuery를 사용할 수 있습니다. 예를 들어, img 태그에 더 나은 ID를 사용하십시오. 작성된 코드 아래

<img id="image" src="your_image.jpg"> 

사용 ..

<script>$(document).ready(function(){ $('#image').css("width":"100%","height":"100%"); }); </script>

는 jQuery 라이브러리를 추가해야합니다.

또는 간단하게 사용할 수 있습니다 ..

<img src="your_image.jpg" width="100%" height="100%" > 

나는 그것이 작동 바랍니다.