JavaScript：需要较低的div（在绝对div下）才能不滚动_Javascript_Jquery_Css

JavaScript：需要较低的div（在绝对div下）才能不滚动

javascript jquery css

JavaScript：需要较低的div（在绝对div下）才能不滚动,javascript,jquery,css,Javascript,Jquery,Css,我有一个问题，我的网站布局现在布局与我做的这把小提琴相似。顶层有我的项目缩略图，下层在用户单击缩略图时显示项目详细信息我遇到的问题是，用户必须向下滚动才能单击顶层的缩略图。然后，当图层淡出时，较低的div已经与它一起滚动-我需要div为scrollTop（0）请看我的小提琴，了解我在说什么： $（'click'）。在（'click'，函数（）上{ $（#topPanel'）。淡出（600）； }) #单击{ 填充：10px 15px；位置：固定； z指数：100； } #顶部面板，底部

我有一个问题，我的网站布局现在

布局与我做的这把小提琴相似。顶层有我的项目缩略图，下层在用户单击缩略图时显示项目详细信息

我遇到的问题是，用户必须向下滚动才能单击顶层的缩略图。然后，当图层淡出时，较低的div已经与它一起滚动-我需要div为scrollTop（0）

请看我的小提琴，了解我在说什么：

$（'click'）。在（'click'，函数（）上{
$（#topPanel'）。淡出（600）；
})

#单击{
填充：10px 15px；
位置：固定；
z指数：100；
}
#顶部面板，底部面板{
宽度：80%；
高度：自动；
保证金：0自动；
填充：100px；
文本对齐：居中；
}
#托帕内尔{
背景：绿色；
位置：绝对位置；
z指数：10；
}
#底板{
背景：黄色；
位置：绝对位置；
z指数：0；
}
#上面板p，#下面板p{
填充：500px0；
文本转换：大写；
}
#底部面板p:n个子级（奇数）{
背景:#555；
}


单击我以淡出顶部


请向下滚动，然后单击上面的按钮查看问题
页首
页中
页底
页首
页中
页底

问题在于您的面板没有滚动：整个文档都在滚动！诀窍是在包装器元素（或主体）上设置

overflow:hidden

，并使用

overflow-y:scroll

使面板本身可滚动

请注意，我必须明确地设置面板的高度（设置为

100vh

，填充视口）

我还修复了您的

文本转换：大写

规则（样式是

文本转换

，而不是

文本转换

：）。

问题是您的面板没有滚动：整个文档都在滚动！诀窍是在包装器元素（或主体）上设置

overflow:hidden