Question

当您将窗口设置为小尺寸时，它会在视口的右侧创建一个巨大的空白区域。我试图在主容器和标题中隐藏溢出，没有任何变化。

直播代码http://jordan.rave5.com/tmptemp/

jQuery代码

        // Control Resize
        $(window).load(function() {

            var header = $('#header'),
                imageGrad = $('.image-grad'),
                image = $('.header-img'),
                headerBg = $('#header'),
                headerSource = $('.header-img'),
                wWidth = $(window).width();

            function resizeDiv () {
                imageGrad.height(image.height());
                imageGrad.width(wWidth);
                headerBg.css({'background-size': + image.width() + 'px ' + image.height() + 'px'});
                $(headerBg).blurjs({
                    source: headerSource,
                    radius: 8,
                    overlay: 'rgba(0,0,0,0.50)'
                });
            }

            resizeDiv();

            $(window).resize(function() { resizeDiv(); });

        });

Answer 1

看看你的代码：

wWidth = $(window).width();是在调整窗口大小时调用的函数之外定义的。这意味着wWidth获取窗口加载的值，该值永远不会改变。缩小窗口时.image-grad会中断布局，因为它的宽度始终等于初始窗口大小您应该将该行放在resizeDiv()函数中。

窗口调整小时不寻常的空间

1 个答案: