0
Ich versuche, die neuesten Karussell-Dokumente zu verwenden, was ich brauche, im Grunde möchte ich 3 Bilder auf großen Bildschirmen 2 in Tabletten und 1 in mobilen Geräten zeigen, die Sache ist, dass ich dies bereits erreichen vor, aber 1 meiner Bilder wurde gestreckt, so habe ich versucht, die automatische Breite zu verwenden, das Bild nicht mehr gedehnt, aber dann tritt ein anderes Problem mein Karussell nicht die Elemente, die ich in das reagierende Objekt eingestellt, versucht es alle passen der Behälter mit allen meinen Einzelteilen, was kann ich mit einem guten Verhältnis zu haben, das Bild zu tun, und dass meine Bilder weiterhin anspricht:Eulenkarussell Artikel mit autoWidth
Code:
<section class="content_section bg_gray border_b_n">
<div class="content row_spacer clearfix" style="max-width:939px">
<div class="owl-carousel">
<div class="item">
<img src="image1.png" width="112" height="112" alt="client name">
</div>
<div class="item">
<img src="image2.png" width="210" height="40" alt="client name">
</div>
<div class="item">
<img src="image3.png" width="210" height="40" alt="client name">
</div>
<div class="item">
<img src="image4.png" width="210" height="40" alt="client name">
</div>
<div class="item">
<img src="image5.png" width="112" height="112" alt="client name">
</div>
<div class="item">
<img src="image6.png" width="210" height="40" alt="client name">
</div>
<div class="item">
<img src="image7.png" width="112" height="112" alt="client name">
</div>
</div>
</div>
$(document).ready(function(){
$(".owl-carousel").owlCarousel({
responsiveClass:true,
items: 3,
autoplay: true,
margin:20,
loop:true,
mouseDrag:false,
autoWidth:true
responsive:{
0: {
items: 1
},
479: {
items: 1
},
768: {
items: 2
},
979: {
items: 3
}
}
});
});