具有位置的问题:包含按钮的粘性页脚

问题描述 投票:1回答:1

我在页面底部有一个浮动div,它由两个按钮组成。为了使浮动按钮在页脚处保持不变,我使用了position:sticky

我面临的问题是,当按钮浮动在页面中的其他按钮上方时,在页脚本身中对按钮的任何单击都将被忽略,而是记录了对基础按钮的单击。页脚按钮的单击操作被忽略。

考虑到浮动页脚的高度,我试图在按钮不可见时取消对click事件的注册,但即使这样也不起作用。有没有办法解决这个问题?

javascript css sticky sticky-footer
1个回答
0
投票

原因是当位置重叠时,粘性位置实际上并未将页脚按钮置于另一个顶部。要实现您想要的功能,只需将z-index置于粘滞按钮(在这种情况下为页脚)]

.sticky-button {
 position: sticky;
 z-index: 1000;
}

这将使粘滞按钮覆盖内容,并且当您单击时,应触发粘滞按钮中的功能

© www.soinside.com 2019 - 2024. All rights reserved.