Question

我需要解决方案来模拟固定位置，但需要相对父div，而不是整个视口。 JS解决方案是滞后的。我需要修复相关的父容器，因为如果窗口高度较小，则固定位置的div进入页脚区域。

Example

Answer 1

另一种方法是更新。

尝试提供固定的div z-index: 10;

页脚div position: relative; z-index: 11

这应该使页脚与固定的div重叠。

Answer 2

然后它不是位置问题：修复，也许你可以定义一个最小高度到你的身体（或主要包装，如果有的话），以避免短页问题

Answer 3

我结合了css和js：

$(document).ready(function () {
                var $sidebar = $(".register-box"),
                $window = $(window),
                $content = $("#content"),
                docHeight = $(document).height();
                var entered = false;

                $window.scroll(function () {
                    if ($window.height() < 795 && docHeight - $window.scrollTop() < 785) {
                        entered = true;
                        var pos = $sidebar.offset();
                        $sidebar.css('position', 'absolute').css('top', ($content.height() - ($sidebar.height() + 40)) + 'px');
                    }
                    else {
                        if (entered) {
                            entered = false;
                            $sidebar.css({
                                top: "",
                                left: "",
                                position: "fixed"
                            });
                        }
                    }
                });
            });

代码不是最终的，数字是硬编码的，但它可以正常运行。

定位固定相关的父容器

3 个答案: