Question

我终于得到了正确的代码并为我正在处理的模板制作了固定的页眉和页脚，并根据窗口大小重新调整大小。当我调整窗口大小时，有没有办法让我的页眉和页脚不要互相接触。我的标题是190px高，我的页脚高134px。我需要一些类似于什么时候页脚的位置是从页面顶部190px以防止它更高

需要这样的东西：

if(window_size_height = 325px){
then stop resizing!}

或

if(footer 325px from top){
then footer_y_position cannot go higher}

这是要测试的样本

http://jsfiddle.net/KYyB7/

编辑：

$(window).resize(function(){   
if($(window).height() < 435+$('#header').height()){
    $('#footer').css('position','relative');
} else {
    $('#footer').css('position','fixed');
}
});

Answer 1

你可以做的就是使用我提到的CSS3媒体查询，或者你可以使用JavaScript / jQuery。

这是在jQuery中执行此操作的方法：

$(window).resize(function(){   
    if($(window).height() < 325){
        $('#footer').css('position','relative');
    } else {
        $('#footer').css('position','fixed');
    }
});

保持固定的页脚和标题不重叠

1 个答案: