我想在 Wordpress 后端创建一个类似于管理员侧边栏的侧边栏,这意味着当我向下滚动主页时,如果侧边栏有更多内容,它也会滚动直到到达其底部内容并停止。向上滚动时会发生相反的情况。我的基本布局如下:
<body>
<header id="Brand">
<div id="Content"></div>
</head>
<div id="Main"></div>
</body>
我的 CSS 目前是:
#Brand
{
bottom: 0;
left: 0;
min-width: 300px;
overflow: auto;
position: fixed;
top: 0;
width: 34%;
}
#Main
{
float: right;
width: 63%;
}
最佳答案
如果我对您的问题的理解正确,您希望侧边栏在您向下滚动页面时滚动。不幸的是,我认为仅使用 CSS 是不可能的。如果您使用 JavaScript,您可以通过动画到所需的滚动位置来实现类似的效果。
$(window).scroll(function(e) {
$('#Content').animate({
scrollTop: $(this).scrollTop()
}, 0);
});
body {
position: relative;
margin: 0;
}
#Content {
bottom: 0;
left: 0;
min-width: 200px;
overflow-y: scroll;
position: fixed;
height: 100%;
top: 0;
width: 50px;
background: red;
}
.inner {
height: 1000px;
}
#Main {
width: 63%;
height: 1000px;
background: black;
}
<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>
<body>
<div id="Content">
<div class="inner">
<ul>
<li>Home</li>
<li>Page 1</li>
<li>Page 2</li>
<li>Page 3</li>
</ul>
</div>
</div>
<div id="Main"></div>
</body>
关于javascript - 滚动主要内容 Div 时可滚动的侧边栏,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/28036393/