在纯css中禁用悬停效果

第一个stackoverflow帖子，所以如果我遗漏了一些明显的东西，请原谅。我确实先搜索了一个答案，但没有找到一个我认为相关的答案

在这个jsfiddle中，我使用了一个div作为悬停目标，以使

以下是标记：

<div class="target">Target
  <a href="#" class="LightMe"><p>.LightMe</p></a>
</div>

将鼠标悬停在标记为Target的灰色框上，然后再次后退以查看
元素上的转换。它正在做我想做的事情：在位置延迟期间不透明度逐渐消失，然后滑动到所需的位置。当移出悬停目标时，
滑动到其原始位置，然后不透明度淡出。到目前为止一切都很好
问题是，如果用户将鼠标悬停在隐藏的
元素上，它会触发同一组转换，从而导致各种意外的破坏
我想阻止对直接悬停在
元素上的任何响应，如果可能的话，我真的想继续将其保留在css中

我尝试在
和
.LightMe
中添加一个显式悬停来覆盖此选项，但没有成功。（尽管这可能是因为我没有正确使用选择器语法。）

为了测试，我特意在
.target
中添加了背景色转换，它提供了一个有趣的线索：悬停在
上会触发
.target
分区的上游转换。这就是我大脑崩溃的地方，我决定最好寻求帮助

我正在处理一些我无法想象的事情，我只是从我能找到的最接近的事情开始，朝着我需要的方向努力。这是JSFIDLE的起点（感谢作者）：
更新：另一个黑客解决方案是放置一个
div
，它位于悬停敏感元素外部，覆盖移动链接。请查看：

我最初的想法（如下）的问题是，你不能点击移动的链接，因为它回到了原来的位置，一旦你从灰色框中悬停，光标也会在隐藏的链接上改变


我会尝试获取
您可以在查看器端口外启动“顶部”位置，并延迟“顶部”转换，直到“左侧”转换结束。这样，

或者您也可以使用此方法，与aorcsik建议的同级选择器结合使用。
这是一个有趣的解决方案，但您必须清除指针，因为链接区域仍在那里。@Bry您是对的，我创建了另一个更粗糙的解决方案，但它确实起到了作用，而且仍然不涉及任何javascript。真的很黑。。。另一个解决方案是，在正确的上下文中，从转换元素的负索引开始，类似于我在这里提出的建议：感谢您的想法，aorcsik-我同意Bry的方法，但我会提供一份您的方法，以备研究，以防我的需求在下游发生变化，并且您的一些想法更适合。非常感谢您的时间和兴趣。谢谢，太好了！我欠你的不仅是想法，还有执行力，因为我可以向你保证，在我目前的水平上，我要花很长时间才能正确添加过渡。没有足够的stackoverflow代表投票支持你，但这个解决方案对我来说是一个巨大的绿色复选标记。
body {
  background-color: #099;
  height: 100%;
  width: 100%;
  margin-top:200px;
}

.target{
  position: absolute;
  left: 40%;
  height: 100px;
  width: 200px;
  padding: 20px;
  background-color: #ccc;
  cursor: pointer;

 }

a {
  display: block;
  position: relative;
  padding: 1px;
  border-radius: 15%;
}

a.LightMe {
  /*Starting state */
    background-color: white;
    border-style:solid;
    border-color:#fff;
    top: -120px;
    left: -200px;
    height: 80px;
    width: 80px;
    z-index: 10;
    opacity: 0;
    transition:left 0.55s  ease, opacity .5s .7s ease;
    -webkit-transition:left 0.55s  ease, opacity .5s .7s ease;
    -o-transition:left 0.55s  ease, opacity .5s .7s ease;
}

.target:hover a.LightMe {
/*Ending state*/
  left: 80px;
  opacity: 1;
  transition:left 0.55s .7s ease, opacity .5s ease;
  -webkit-transition:left 0.55s .7s ease, opacity .5s ease;
  -o-transition:left 0.55s .7s ease, opacity .5s ease;
}

.target:hover {
    transition: background-color 500ms ease;
    -webkit-background-color 500ms ease;
    -o-background-color 500ms ease;
    background-color:#999;
}

.mainclass.subclass:hover + a.LightMe {
    /* ... */
}