调整窗口大小时更改元素的高度

Question

正如您在图片中看到的那样，我的幻灯片中的容器存在问题。内容和幻灯片之间的差距越大，窗口大小越小，这就是我想要避免的。

在调整窗口宽度的大小时，内容容器应自动更改像素的像素高度。因此，它为网站提供了一个很好的流程，幻灯片和不同屏幕尺寸的内容之间没有很大的空间。

我现在制作了一个JSFiddle：https://jsfiddle.net/joggal/fk3v7aau/2/

希望它显示我的问题：容器是绝对定位但我希望它调整大小，因此幻灯片放映和带行的容器之间的差距不会太大/太小。我希望容器直接位于滑块下方。

我尝试在CSS中使用@media修复它，但这根本不是最佳解决方案：（

我希望你能帮助我：D

Answer 1

1. 首先在窗口调整大小功能中获取滑块的高度。

2. 然后将其附加到图像上。

   $( window ).resize(function() { var SliderHeight = $('.slide').height(); $( ".img" ).css('height',SliderHeight); });