jquery - 不同宽度的 bxslider 图像

Question

我正在尝试将 bxslider 与不同尺寸的图像一起使用，我希望这些图像具有相同的高度和不同的宽度。我想要一个像 http://bxslider.com/examples/carousel-demystified 上的示例那样的轮播。这些示例工作正常，但是，我的图像宽度为 300、400 和 500 像素，每个图像都有不同的高度，并缩放到相同的 400 像素高度。我不想调整图像的宽度，使它们相同或裁剪它。如何使用 bxslider 处理不同宽度的图像？

如果使用 bxslider 无法完成此操作，那么是否已经存在用于此行为的 jquery 插件？

示例:http://jsfiddle.net/GdD52/2/

<ul class="slider1">
    <li class="slide"><img src="http://placehold.it/140x130&text=FooBar1"/></li>
    <li class="slide"><img src="http://placehold.it/150x115&text=FooBar2"/></li>
    <li class="slide"><img src="http://placehold.it/130x160&text=FooBar3"/></li>
    <li class="slide"><img src="http://placehold.it/145x142&text=FooBar4"/></li>
</ul>

Answer 1

#bx-wrapper img {
    width: auto !important
}

但我在触摸滚动方面遇到问题。所以我要尝试owlCarousel .