Question

嗨，我正在制作一个div，它将在滚动上有固定位置，如果高度较小但是如果高度增加我将无法再滚动页面我没有得到什么问题，我已经做了一个jsfiddle，看看这里

和代码是

var div = $('.PropertyContainer');
    var start = $(div).offset().top;

    $.event.add(window, "scroll", function () {
        var p = $(window).scrollTop();
        var height = $(div).height();
        $(div).css('position', ((p) > start) ? 'fixed' : 'static');
        $(div).css('top', ((p) > start) ? '0px' : '');
        $(div).css('min-height', ((p) > start) ? '336px' : '70%');
        $('.FormWrapper').css('margin-left', ((p) > start) ? '181px' : '');
    });

请帮助我，我正在工作2天，但没有做任何事情

提前致谢

Answer 1

问题是由 PropertyContainer 的高度引起的。这是您页面上最大的元素，因此定义了垂直滚动条。

但是当你开始滚动时，你将他的定位改为'固定'。此时， PropertyContainer 高度不再计算页面的总高度，页面会垂直缩小，导致滚动条很快消失。

然后你陷入无限循环：

滚动条消失＆gt; scrollamount = 0＆gt;位置再次变为静态＆gt;页面变得更高＆gt;滚动条重新出现＆gt; ...

可能的解决方案：

当您将 Formwrapper 设置得更高，以便 PropertyContainer 不再定义页面高度时，您的脚本就可以运行。

http://jsfiddle.net/willemvb/CdpeK/

Answer 2

您是否尝试过fixed-position your elements using？这应该比JavaScript更好，更快，但如果你的目标是移动设备，这个选项是不可能的（他们还不支持固定定位，至少旧版本的Android和iPhone不支持）。

滚动中固定的div位置在所有条件下都不起作用

2 个答案: