jqueryを使ってスライダーに画像をフィットさせる方法

Question

私はjcarouselスライダーを持っており、モバイルアプリでスライダーに画像を収めようとしています。

これはスライダのCSSコードです。 （

. 

jcarousel-wrapper { 

    padding:auto; 
    position: relative; 
    width: 100%; 
    height: 100%; 
    -webkit-border-radius: 5px; 
    -moz-border-radius: 5px; 
    border-radius: 5px; 
    -webkit-box-shadow: 0 0 2px #999; 
    -moz-box-shadow: 0 0 2px #999; 
    box-shadow: 0 0 2px #999; 
} 


.jcarousel-wrapper .photo-credits { 
    position: absolute; 
    right: 15px; 
    bottom: 0; 
    font-size: 13px; 
    color: #fff; 
    text-shadow: 0 0 1px rgba(0, 0, 0, 0.85); 
    opacity: .66; 
} 

.jcarousel-wrapper .photo-credits a { 
    color: #fff; 
} 

.jcarousel { 
    position: relative; 
    overflow: hidden; 
} 

.jcarousel ul { 
    width: 2000em; 
    position: relative; 
    list-style: none; 
    margin: 0; 
    padding: 0; 
} 

.jcarousel li { 
    float: left; 
} 

.jcarousel li img { 

    max-width: 100%; 
    max-height: 100%; 
} 

この

はHMTLコード

<!-- Wrapper --> 
<div class="jcarousel-wrapper"> 
    <div class="jcarousel"> 
     <ul> 
      <li><a href="linkxxxx"><img src="../www/img/banner-home1.jpg" alt=""></a></li> 
      <li><a href="linkxxxx"><img src="../www/img/banner-home2.jpg" alt=""></a></li> 
      <li><a href="linkxxxx"><img src="../www/img/banner-home3.jpg" alt=""></a></li> 
      <li><a href="linkxxxx"><img src="../www/img/banner-home4.jpg" alt=""></a></li> 
     </ul> 
    </div> 
</div> 

であり、それはdiv要素に収まらない、この画像のように動作したときに、これは

(function() { 
     $('.jcarousel') 
     .jcarousel({ 
       wrap: 'circular' 
       }) 
     .jcarouselAutoscroll({ 
          interval: 4000, 
          target: '+=1', 
          autostart: true 
          }); 
     }); 

だから今スライダーのJavaScriptコードでありますラッパー）。jqueryを使ってdivsを画像に設定するにはどうすればよいですか？

Answer 1

私はいけないちなみにこの

$(document).ready(function() { 
         var divWidth = $(window).width(); 
         $('.jcarousel img').css('width', divWidth+'px'); 

    }); 

Answer 2

ところで私はイメージのサイズを知らないので、まずイメージのサイズを覚えなければならず、プログラムが動的に作成するdivに合わせなければなりません。

Answer 3

下のスニペットを参照してください。親divの中に画像を収める方法がわかります。

img{ 
 
    max-width:100%; 
 
    width:auto; 
 
}

<div class="parent"> 
 
    <img src='http://www.fitzmuseum.cam.ac.uk/sites/default/files/1_0.jpg'> 
 
</div>