我难以构建响应式flexslider，但设法找到解决方案，并认为我会在这里分享。
我希望有一个适合可用屏幕尺寸的柔性滑板旋转木马，因为它出现在灯箱内，并且旋转木马图像可能具有不同的尺寸和比例，但仍然适合滑块和屏幕。
我最初看到的一些替代解决方案包括：
使所有图像的大小和比例相同
提供图像作为背景图像而不是使用实际图像 图像元素
但我想要一个使用实际图像的解决方案。
Flex滑块的难点在于，当您使用不同尺寸的图像时，作为flex-viewport的密钥容器的高度由最高的图像设置。因此，即使设置了flex-viewport的宽度，高度也将由最高的图像决定。尝试使用百分比将flex-viewport设置为相对高度不起作用，因为它仍然被最高图像的高度覆盖。
可以设置固定高度（以像素为单位），但这显然不会改变，具体取决于所使用的显示器的大小。
答案 0 :(得分：0)
解决方案真的不是那么困难，您只需要使用jQuery获取显示的高度，然后根据显示高度将flex-viewport高度以及图像的高度设置为设置的像素高度，例如：
h = ($(window).height()*0.8);
$('.flex-viewport').height(h);
$('.slides img').height(h);
使图像居中并使它们合适我使用CSS：
img {width: auto; margin: auto;}
以及主要的Flexslider容器：
.flexslider {margin: auto; max-width: 90%;}