我试图在下面的截图中重新创建效果：

紫色的圆圈（气泡）将在屏幕上移动，当鼠标悬停在标题上时，它们应该“反转”它们下面标题的颜色，紫色到白色，白色到黑色，以便它们可见。
我认为，为了达到这种效果，气泡需要充当两层标题之间的遮罩，一层是“暗”，另一层是“亮”颜色，如下所示：

<dark header layer>
<bubbles>
<light header layer>

黑暗的标题层将有最低的z-指数和轻标题的最高.气泡会比使它这样，只有在其框架中的轻标题的一部分显示.任何想法，类似的问题等.这将有助于我实现这种效果？