我正在编写一个chrome扩展,它使用注入来修改目标网页中的元素.
我想在光标移动元素时显示消息气泡.但我遇到一个问题,有时消息泡沫被其他一些元素隐藏.我发现这是因为如果元素B位于元素A的顶部,则z-index将不起作用,元素A的子元素(消息气泡)永远不会高于元素B.
我想在光标移动元素时显示消息气泡.但我遇到一个问题,有时消息泡沫被其他一些元素隐藏.我发现这是因为如果元素B位于元素A的顶部,则z-index将不起作用,元素A的子元素(消息气泡)永远不会高于元素B.
为了演示它,这是一个例子.尽管obj2的z-index是1000000,obj2总是会被obj3隐藏.
有什么解决方案吗？
.aaa{
background-color:blue;
width:100px;
height:100px;
}
.ccc{
background-color:red;
width:80px;
height:80px;
z-index:1000000;
}
.bbb{
background-color:green;
position:relative;
top:-50px;
left:50px;
width:100px;
height:100px;
}
<div>
<section id=obj1 class="aaa">
<article id=obj2 class="ccc">
</article>
</section>
</div>
<section id=obj3 class="bbb">
</section>
