6

我猜不是，但是能够z-index使用 CSS 或 Javascript 设置光标的位置真的很不错。

假设您有一些按钮，并且您想在按钮顶部添加半透明图像以获得效果。或者在我目前的情况下，一些具有悬停和单击操作的 SVG 路径。如果我可以将按钮或 SVG 设置z-index为 0，我的光标z-index设置为 1，图像覆盖z-index为 2，那就太好了！鼠标将在覆盖层下方，仍然可以单击按钮。将视觉（光标看起来在哪一层）与有效（光标实际上是哪一层z-index）分开设置会更加壮观。z-index因此，光标可能会出现在叠加层的顶部，但仍然可以单击下方的按钮。

我有我的怀疑，但我想我会检查是否有人听说过有人这样做或类似的事情。

4

3 回答 3

6

由于没有答案被接受，我想提供正确的答案。

是pointer-events: none解决方案。

请参阅简单的 CSS 示例：

.emotion_message {
    pointer-events: none;
    background-color: rgb(144,238,144,0.5);
    height: 20%;
    width: 94%;
    position: absolute;
    top: 40%;
    color: darkgreen;
    padding: 1%;
    text-align: center;
    border-radius: 10px;
    margin-left:3%;
    margin-right:3%;
}

在此示例中，我想显示一个图表，顶部有一个静态摘要框，但我希望光标与下面的图表交互。我还向 中添加了不透明度background-color，因此用户既可以看到被淹没的元素（在本例中为图表），也可以与其交互。现在用户看到了这个框，但光标没有。

感谢@FabricioMatte 在评论中给出这个答案。

于 2020-10-06T05:47:12.920 回答
1

你可以用光标玩：无；

查看相关问题：是否可以将鼠标光标放在元素后面或者鼠标光标是否有 z-index？

于 2013-05-01T21:07:20.333 回答
1

没有光标 z-index 这样的东西。你可以做的是有一个 jQuery hover 函数来获取光标悬停的对象，作为回报，它允许你找到对象 z-index。因此，实际上不是希望光标具有 z-indexes，而是具有悬停状态。

然后根据位置自定义光标。正如每个人所说cursor:none，玩这个会很有趣。假设您想进入一个 alpha 块下，您可以在该 alpha 块下渲染一个光标以获得光标在其下的效果。

于 2013-05-01T21:08:25.610 回答