javascript - 更新了幻灯片高度的响应式 slider

Question

我有一个列表，其中每个元素都包含一个文本和一个图像:

<div class="slider">
  <ul>
    <li>
      <div class="txt"><p>First slogan</p></div>
      <div class="img"><img src="http://placehold.it/800x180" /></div>      
    </li>
    <li> ... </li>
  </ul>
</div>

我需要它响应...img 和 txt div 在窗口大小调整时缩放。

在某个点之后，img div 变成了 txt div 下面，如 codepen 中所示:

SLIDE EXAMPLE

这工作正常 ...但现在我需要让它像 slider 一样工作。

我正在尝试使用 Cycle2 来实现它JQuery 插件:

SLIDE EXAMPLE WITH CYCLE 2

高度不适应幻灯片内容。

有人可以帮帮我吗？

谢谢，米格尔

Answer 1

如果您查看他们的文档 here它有很多选项来调整高度，比如添加 <div class="slider" data-cycle-auto-height="1:1">

希望对您有所帮助。