gpt4 book ai didi

jquery - 如何将div float 到一边并在滚动时保持粘性

转载 作者:搜寻专家 更新时间:2023-10-31 22:46:44 25 4
gpt4 key购买 nike

所以我有一些隐藏的 div,但当您单击具有与 div 类对应的 id 的 span 时显示。我有那个公园在工作,它会显示 div,但我有一长串不在页面上的东西。我希望隐藏的 div 粘在屏幕顶部,这样如果用户单击最下方的链接,他们就不必一直滚动到顶部才能看到它。下面是一些代码,可以让您了解我正在使用什么。

HTML:

<div id='container'>
<div id='nav'>
Nav things
</div
<div id='main'>
<span class='clickme' id='1'>Thing 1</span>
<span class='click me' id='2'>Thing 2</span>
Etc..
</div>
<div class="div_class 1'>
Explanation of Thing 1.
</div>
<div class='div_class 2'>
Explanation of Thing 2.
</div>
</div

CSS:

#container
{
margin: 0px auto;
width: 90%;
}
#nav
{
float: left;
width: 15%;
}
#main
{
float: left;
width: 15%;
}
.div_class
{
float: right;
display: none;
}

我已尝试在 div_class 类上使用“posistion: fixed”,但这会将文本置于左上角,与导航 div 重叠。然后我尝试添加填充,但这会使 div 与一些链接重叠并使它们不可点击。

最佳答案

您在 position: fixed 的正确轨道上。你只需要告诉元素去哪里:

#floater {
position: fixed;
top: 0;
right: 0;
}

根据需要调整topright(或leftbottom)以避免重叠导航部分。

参见 this JSFiddle用于基本演示,以及this one带有导航栏。

关于jquery - 如何将div float 到一边并在滚动时保持粘性,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/16678566/

25 4 0
Copyright 2021 - 2024 cfsdn All Rights Reserved 蜀ICP备2022000587号
广告合作:1813099741@qq.com 6ren.com