粘贴边栏问题

Question

我正在使用stickySidebar.js作为我的侧边栏。我最近发现的问题就像你在下面的图片中看到的那样，它出现在Internet Explorer，Chrome，Opera，Firefox，Safari（MAC）和iPad的#container上方。

我猜它与positioning: ;有关，但我无法弄清楚它是否有问题，也许剧本正在改变定位。

我还发现，如果您将浏览器窗口全屏展开，#sidebar就会出现在容器顶部。但是如果缩小浏览器窗口并重新加载。 #sidebar出现在容器上方，如下图所示。同样适用于JSFiddle，如果你缩小上面显示的窗口，如果你扩展它，它看起来应该在顶部。

我做了一个功能齐全的 JSFiddle here 。

我的CSS：

 #sidebar {
    display: block; margin: 0 0 0 80px; padding: 10px 0 0 0;
    width: 290px; height: 300px;
    background-color: #ffffff;
    -webkit-border-radius: 5px; -moz-border-radius: 5px; border-radius: 5px;
    z-index: 10;
}
#sidebar.sticky { float: none; position: fixed; top: auto; z-index: 10; left: auto; }

    div#container {
        position: relative; float: left; clear: none;
        display: block; margin: 0; padding: 0;
        width: 100%; height: 2000px;

        background-color: yellow;
    }

    footer {
        position: relative; float: left; clear: none;
        display: block; margin: 0; padding: 0;
        width: 100%; height: 500px;

        background-color: #1a3c58;
    }

如果我将#sidebar.sticky位置从fixed更改为absolute。该脚本不起作用。

感谢。

Answer 1

只需从config变量中删除此行：

sidebarTopMargin: -10,

这似乎是你不想要的。