Изменение высоты элемента при изменении размера окна

Question

Как вы можете видеть на картинке, у меня проблемы с контейнером в моем слайд-шоу. Разница между контентом и слайд-шоу становится больше, чем меньше размер окна, чего я хочу избежать.

На изменении размера ширины окна, контейнер содержимого должен автоматически изменять высоту пикселя для пикселя. Таким образом, он дает сайту приятный поток, и между слайд-шоу и содержимым на разных размерах экрана нет большого пространства.

Я сделал JSFiddle Сейчас: https://jsfiddle.net/joggal/fk3v7aau/2/

Надеется, что это показывает мою проблему: контейнер абсолютно позиционированный, но я хочу, чтобы изменить размер, так что зазор между слайд-шоу и контейнером с рядами не слишком большой/маленький. Я хочу, чтобы контейнер находился под ползунком.

Я попытался это исправить с @media в CSS, но это не самое лучшее решение на всех :(

Я надеюсь, что вы можете мне помочь: D

Answer 1

1. Сначала получите высоту ползунок в функции изменения размеров окна.

2. Затем добавить его к изображению.

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