我正在尝试制作一个粘在屏幕底部的菜单栏。由于它在屏幕上的位置,我不能使用锚标签进行超链接,因为在Google Chrome中,它会导致小链接栏出现在底部角落(覆盖在菜单顶部)。
因此,每个菜单图标都是具有唯一ID的DIV (例如,"profile"),并将“菜单项”类应用于它。这些图标中的每一个都会在单击时链接到特定的页面(例如,为什么我想使用onClick javascript事件)。但是,当将鼠标悬停在这些图标上时,会在其上方弹出上下文工具提示(或子菜单)。在此工具提示内有更多选项或链接。因此,我提出了以下html结构:
example image located he
问题是在iOS Safari中没有正确处理100vh。它错误地计算了到底部safari菜单栏底部的高度,并将弹出菜单渲染到菜单栏的下边缘。这导致菜单被部分隐藏,并产生问题是为使用100vh的跨设备设计可滚动弹出菜单。details here | more details here 因此,希望找到一个不使用100vh的替代解决方案,这样它就可以在所有浏览器和平台上工作。