Question

我有以下JSFIDDLE来展示我正在使用的页面布局，但我很难实现我想要的目标。

如果将主要内容一直滚动到底部，您会看到侧边栏的底部与页脚顶部相符。 这应该总是看起来。但是，如果您调整大小或滚动，您将看到它不是这样。

经过几天的css小提琴后，我总结说这只能用js完成。请提供一个工作小提琴，特别是，如果你声称它可以使用CSS完成，因为其他人在我的另一个问题中，我无法得到任何工作的答案。提出的所有答案的问题是position:fixed被移除，侧边栏滚动主要内容，这不应该发生。

请帮助达到预期的效果

Answer 1

更新：

这显然无法在CSS上实现，这是一个jQuery解决方案。

var vh = $("body").height() - $("footer").height();
var sh = $("#side").height();

$(window).resize(function() {
    vh = $("body").height() - $("footer").height();
    sh = $("#side").height();
});

$(document).scroll(function() {
    var vs = $(document).scrollTop() + sh + $("footer").height();

    if(vs < vh)
        $("#side").css("bottom", "0px");
    else
        $("#side").css("bottom", (vs - vh) + "px");
});

这是一个用于测试的jsFiddle。

修复了侧边栏 - 使用jQuery粘贴到页脚

1 个答案: