Question

我正在将此代码用于我正在开发的网站。我遇到的问题是滚动到固定面板div。

HTML：

<div id="wrapper">
    <div id="a" class="panels">FIXED PANEL</div>
    <div id="b" class="panels">Scrolling-Panel 1</div>
    <div id="c" class="panels">Scrolling-Panel 2</div>
    <div id="d" class="panels"><a href="#a">Scrolling-Panel 3</a></div>
</div>

CSS：

html,body {
    padding:0;
    margin:0;
    background:black;
}

#wrapper {
    position:absolute;
    height:100%;
    width:100%;
}

.panels {
    position:relative;
    height:100%;
    min-height:100%;
    width:100%;
}

#a{
   background:#eee;
    position:fixed;
    color:red;
    top:0;
}

#b{
   margin-top:100%;
   background:yellow;
}

#c{
   background:pink;
}

#d{
   background:green;
}

小提琴在这里： http://jsfiddle.net/ygw6b9ga/ 任何想法/帮助将非常感谢!!

Answer 1

在页面中单击指向不同元素的链接锚点会告诉浏览器滚动视口或相应的包装器，以便可以看到左上角（在LTR页面中）的元素。固定元素不会影响滚动区域，因此定位和聚焦它们不会启动此例程。

在您的示例中，您可以定位#wrapper而不是#a来重新显示固定标头（<a href="#wrapper">…</a>，fiddle）或诉诸javascript（<a href="#a" onclick="scrollTo(0,0)">…</a> {{3 }}）。

Div滚动固定div锚链接不起作用

1 个答案: