Question

所以我有一个幻灯片块（它的响应），我为这个块设置了min-height: 315px，我真的需要它，但是当我调整窗口大小时我需要平滑地减少min-height，现在我写了jQuery代码，所以它的工作，但它的丑陋tbh。

function minHeightBehavior(width) {
        width = parseInt(width);
        element = $('#block-views-home-page-slider-block');
        sliderHeight = $('.views-field-slider').height();
        element.css('min-height', '315px');
        if (width >= 769 && width < 960) {
            console.log(sliderHeight);
            element.css('min-height', sliderHeight +'px');

        }

    }

现在在滑块下方阻挡，向上跳跃，因为例如，当窗口screen width为900时，element height为300，如果screen width为899，element height也是300。之后如果screen width是898，element height是299，等等也许那里有更好的解决方案？

Answer 1

使用.animate方法。

（并开始使用var作为局部变量）

function minHeightBehavior(width) {
        var width = parseInt(width),
            element = $('#block-views-home-page-slider-block'),
            sliderHeight = $('.views-field-slider').height(),
            minHeight = 315;

        if (width >= 769 && width < 960) {
            minHeight = sliderHeight;
        }

        element.animate({height: minHeight + 'px'}, 500, function(){
           $(this).css({'min-height': minHeight + 'px', 'height':'auto'});
        });

    }

Answer 2

有没有办法将min-height设置为百分比？而不是使用像素。

根据我的div高度改变最小高度

2 个答案: