Bootstrap Dropdown部分阻止页面内容

Question

我以两种方式改变了我的Bootstrap下拉列表：

• 下拉列表显示下拉列表，而不是点击
• 它下拉的li仍然是可点击的链接

下拉功能正常工作，但是当您按下下拉列表的li时，当您到达第二个或第三个项目时，下拉列表会消失。据我所知，无论下面页面上的内容如何，​​都会发生这种情况。

我不确定问题出在哪里，因为我检查了z-index的任何CSS实例。

当您将鼠标悬停在“工具”的菜单项上时，您可以直接看到下拉列表问题here。我会在这里粘贴HTML和/或CSS，但我真的不确定问题所在，所以我会提出大量的代码和/或猜测....

Answer 1

希望这有帮助

替换下面的css

enum CompressError: Error {
    case ratioOutOfRange
}

func compress(image: UIImage, withRatio ratio: CGFloat) throws -> Data? {
    if 0...1 ~= ratio {
        return UIImageJPEGRepresentation(image, ratio)
    } else {
        throw CompressError.ratioOutOfRange
    }
}

与

* {
    font-family: "Raleway", sans-serif;
    color: #333232;
    position: relative;
    z-index: 10;
}

为所有元素删除* { font-family: "Raleway", sans-serif; color: #333232; position: relative; } ，我认为您已为各个元素设置了z-index。然后无需为所有元素设置。

Answer 2

这可能会指向正确的方向或帮助调试 - 请参阅附带的屏幕截图。看起来它与包裹标题的.row元素的高度有关。如果增加高度，则可以看到菜单在鼠标悬停在其中的所有元素时仍然存在。

如果使用.row元素触发显示/隐藏可见性，则有意义的是，当鼠标移开时，菜单会再次隐藏。 如果您需要进一步的帮助，请提供您用来触发互动的JavaScript和CSS。