jquery - 在中间宽度不同的旋转木马中部分显示下一张和上一张图像

Question

我想使用 jQuery(不使用 wordpress)制作这样的 slider 。

请参阅Slider example 1和 Slider example 2

我一直在尝试使用 slick carousel，但 centermode 和 variablewidth 设置的组合似乎无法提供我想要的效果(图像未放置在中心)。

我也尝试过其他 slider ，但中心图像不能有不同的宽度。

Answer 1

你有两个选择

如果你想让图片占据整个轮播那么

img { width: 100%; height: auto; }

如果您不希望图像拉伸(stretch) 100%，则设置您想要的宽度(或者不设置，只需指定边距)和边距自动:

img { width: 50%; margin: auto; }

如果您使用的是默认 Bootstrap 轮播

.carousel-inner .item a img {

margin: auto;

}